'분류 전체보기' 카테고리의 글 목록 (4 Page)

728x90

문제 16. 시간 입력받아 그대로 출력하기.

- map을 사용해서 두번 사용하는 int를 반복 해주었다. input으로 입력을 받을때 빈칸을 split(':')으로 콜론으로 구분해주었다.

- 출력은 :콜론과 입력받은 a와 b를 출력해주었다.

문제 17. 연월일 입력받아 그대로 출력하기

- 연월일을 a b c에 입력받은 값을 넣어 출력해 주었다.

- %02d는 한 자리 수인 경우 앞에 0을 붙여 출력해 주었다.

* 년도는 두자리 수가 입력되는 경우는 없지만, 올바른 계산을 위해서 %04d를 출력해주는 것이 올바른 답이다.

문제 18. 주민번호 입력받아 형태 바꿔 출력하기

- 쉽게 생각해서 -로 구분되어 입력을 받고 그것을 바로 출력해주면 된다.

문제 19. 단어 1개를 입력받아 그대로 출력하기

- a에 입력을 받은 값을 넣고 출력해 주었다.

문제 20. 문장 1개 입력받아 그대로 출력하기

- a에 입력을 받은 값을 넣고 출력해 주었다.

문제 21. 실수 1개 입력받아 부분별로 출력하기

- a와 b에 각각 입력을 받아서 .으로 구분을 한다. ( a.b 형태이다 )

- 출력을 할때 a 줄바꿈 b 로 출력하여 정수와 실수를 구분해서 출력한다.

728x90

저작자표시 (새창열림)

'프로그래밍 > 파이썬 문제 100' 카테고리의 다른 글

문제 11~15 (0)	2021.02.04
문제 1~10 (0)	2021.02.01

728x90

우리는 웹 사이트를 사용하면서

입력을 통해서 데이터를 서버로 보내야하는 경우가 있다

예를 들어서 로그인을 하는 경우

아이디, 비밀번호를 입력해서 데이터를 서버에 전송한다.

이러한 태그를 폼이라고 한다.

폼을 만들어보자

<html>
<head>
    <meta charset="utf-8">
</head>
<body>
<form action="http://전송하기 위한 서버 주소">
    <p>아이디 : <input type="text" name="id"></p>
    <p>비밀번호 : <input type="password" name="pwd"></p>
    <input type="submit">
</form>
</body>
</html>

코드를 한 줄씩 읽어보면

form action="해당 서버로 전송"

input type="입력타입" name="입력받는 컨트롤에 이름"

input type="패스워드처리입력" name="입력받는 컨트롤에 이름"

input type="버튼"

이렇게 해석할 수 있다. 어렵지 않다 우리가 입력해서 전달하고자 하는 데이터에 타입과 이름만 주어진 것이다.

html 파일을 열어보면,

입력을 할 수 있는 구조가 되었다!

이제 여러가지 폼 태그에 대해 알아보자!!

이번에는 텍스트 필드를 만들어 보자!

<html>
<head>
    <meta charset="utf-8">
</head>
<body>
<form action="http://localhost/login.php">
    <p>아이디 : <input type="text" name="id"></p>
    <p>비밀번호 : <input type="password" name="pwd"></p>
    <p>textarea :
       <textarea cols="50" rows="10">default value</textarea>
    <input type="submit">
</form>
</body>
</html>

textarea는 텍스트 내용을 여러줄 입력할 수 있게 만들어졌다.

이때 속성을 가지고 여러 내용을 입력할 수 있다.

cols 속성은 열이라는 컬럼을 명시한다.

rows 속성은 행이라는 라인수를 명시한다.

Dropdown List - 제한된 선택지에서 선택을 하는 방식

<html>
<head>
    <meta charset="utf-8">
</head>
<body>
<form action="">
<h1>색상</h1>
<select name="color">
	<option value="red">붉은색</option>
	<option value="black">검은색</option>
	<option value="blue">파란색</option>
</select>
<input type="submit">

<h1>색상</h1>
<select name="color22" multiple>
	<option value="red">붉은색</option>
	<option value="black">검은색</option>
	<option value="blue">파란색</option>
</select>
    <input type="submit">
</form>
</body>
</html>

form action으로 전송할 서버 경로를 지정하고

select name="선택지 이름"으로 선택을 하는 select를 사용해서 이름을 정해준다.

option value="옵션에 값"으로 선택지에 선택할 항목으로 지정 값을 정해준다.

쉽게 설명하면 선택지를 주고 항목을 보여준것이다. 붉은색에 해당하는 값은 red로 url에서는 color=red로 이름=값을 표시한다.

* select에서 mutiple를 사용하면 여러 항목을 선택할 수있다.

checkbox와 라디오

<html>
<head>
    <meta charset="utf-8">
</head>
<body>
<form action="서버 주소">
<p>
<h1>색상</h1>
붉은색 : <input type ="radio" name="color" value="red">
검은색 : <input type ="radio" name="color" value="black" checked>
파란색 : <input type ="radio" name="color" value="blue">
</p>
<p>
<h1>여러 색상 선택</h1>
95 : <input type ="checkbox" name="size" value="95">
100 : <input type ="checkbox" name="size" value="100" checked>
105 : <input type ="checkbox" name="size" value="105" checked>
</p>
<input type="submit">
</form>
</body>
</html>

단일 선택을 하는 경우 여러 항목 중 한가지를 선택하는데 이때 라디오가 사용된다.

다중 선택을 하는 경우 여러 항목을 선택하는데 이때 체크 박스가 사용된다.

input type에 checked를 사용하면 미리 체크가 되어있어서 선택을 유도할 수 있다.

지금까지 폼 태그에서 데이터 전송으로 눈에 보이는 데이터 전송이었다.

이번에는 눈에 보이지 않지만 서버에 데이터를 보내는

Hidden을 사용해보자

<html>
    <head>
      <meta charset="utf-8">
    </head>
    <body>
       <form action="서버 주소">
          <input type="text" name="id">
          <input type="hidden" name="hide" value="TeamH4C">
          <input type="submit">
       </form>
    </body>
</html>

우리가 평소에 사용하던 text 타입은 실제로 눈에 보인다.

하지만

hidden 타입을 사용하면 ui로 볼 수 없다. 그래도 데이터 전송은 이루어 진다.

추후 우리는 자주 사용할 타입이다.

728x90

저작자표시 (새창열림)

'Web' 카테고리의 다른 글

HTML 태그 정리 01 (0)	2021.02.11
HTML 페이지 기본 (0)	2021.02.11
HTML이란? (0)	2021.02.11

728x90

<!DOCTYPE html>
<html lang="ko">
	<head>                          <!--head 태그-->
		<meta charset="utf-8">      <!--meta 태그-->
		<title>Easy-day</title>     <!--title 태그-->
	</head>
	<body>
		<h1> 우리는 다양한 보안 공격과 방어를 배우지만</h1>  <!--h1~6 태그-->
        <hr>       <!--hr 태그-->
        <h2> 그것보다 중요한 것은 정보에 가치라고 생각한다.</h2>  <!--h1~6 태그-->
        <br>
        <h3> 정보와 보안에 대해 철학적인 접근을 해보자 </h3>
		<p>우리가 정보에 가치를 어떻게 평가하냐 인데</p>             <!--p 태그-->
        <pre> 체크리스트에 의존하여 정보에 가치를 평가하기 보다
	    	그 정보가 어떻게 어떤 영향을 미치는지 깊게 생각해봐야 한다.  </pre>   <!--pre 태그-->
        <section>
        <div> 								<!--div 태그-->
         <p> 우리는 공부를 하면서 공부에 목표와 가치 그리고 의미를 생각하며 공부해야한다.</p>
        </div>
         <p> Never give up </p>
    </sectopm>
	</body>
</html>

<head> 태그

HTML 문서에 대한 정보를 담고 있습니다. 일반 사용자는 웹 사인트에서 <head>태그에 속한 정보를 볼 수 없습니다.

문서 안에 단 하나 존재할 수 있으며, <html> 태그 바로 아래 위치합니다.

<title> 태그

HTML 페이지의 타이틀은 페이지의 제목으로, 브라우저의 타이틀 바에 출력됩니다. 타이틀은 <title>태그를 이용하며 <head> 내에서만 작성되어야 합니다.

<h1>~<h6> 태그

일반적으로 보고서 등의 문서는 장, 절, 문단 등으로 구조화하고, 알아보기 쉽도록 장이나 절의 제목 크기를 달리합니다. HTML은 <h1>~<h6>의 6개 태그를 제공하여 문단에 제목을 붙일 수 있도록 합니다.

h는 제목을 뜻하는 heading의 줄임말이며, <h1>이 가장 큰 제목이고, <h6>가 가장 작은 제목입니다. <h>태그에 의해 출력되는 제목의 글자 크기는 브라우저가 결정하며, CSS 스타일 시트를 이용하여 개발자가 변경할 수 있습니다.

<p> 태그

HTML에서 문단은 여러 단락으로 나눌 수 있으며 하나의 단락은 <p> 태그로 표현합니다. CSS스타일을 사용하면 단락 단위로 내어쓰기, 들여쓰기를 제어할 수 있습니다. <p> 태그는 문단을 표현하기 때문에 </p>로 끝나는 문단 다음에는 자동으로 빈줄이 생깁니다.

<hr> 태그

문단 내에서 내용의 전환이 필요한 곳에 수평선을 삽입하여 시작적 효과를 만들 수 있습니다.

*<hr> 태그는 종료 태그가 없습니다.

<br> 태그

새로운 줄로 넘기고자 하면 <br> 태그를 사용합니다.

<pre> 태그

브라우저는 개발자가 HTML 문서의 모양을 포맷하기 위해 삽입한 여러 개의 빈칸이나 Enter를 모두 하나의 빈칸으로 처리하므로, 개발자가 의도한 모양대로 출력되지 않습니다. 이때 <pre></pre> 태그로 둘러싸면 개발자가 입력한 포맷 그대로 출력됩니다.

<div> 태그

<div>는 <p>와 함께 블록을 구성하기 위해 가장 많이 사용됩니다. <p> 태그는 문단을 만들기 위해 사용되지만, <div>는 특별한 의미 없이 여러 HTML 태그들을 블록으로 묶는 컨테이너로 이용됩니다.

<span> 태그

텍스트 일부분에 특별한 모양을 주거나, 자바스크립트를 코드로 텍스트 일부분을 제어하고자 할 때 사용합니다.

<base> 태그

웹 페이지들이 담겨 있는 기본 URL과 웹페이지가 출력될 윈도우를 지정하기 위해 사용됩니다.

<meta> 태그

웹 페이지의 저작자, 문자 인코딩 방식, 문서 내용 등 다양한 메타 데이터를 표현 하기 위해 사용됩니다. 메타 데이터는 name과 content의 속성 쌍으로 구성됩니다.

728x90

저작자표시 (새창열림)

'Web' 카테고리의 다른 글

HTML - form 태그 (0)	2021.02.11
HTML 페이지 기본 (0)	2021.02.11
HTML이란? (0)	2021.02.11

728x90

<!DOCTYPE html>
<html lang="ko">
	<head>
		<meta charset="utf-8">
		<title>Easy-day</title>
	</head>
	<body>
		<h1>html 구조에 대하여 공부하는 시간!</h1>
		<p>웹 공부에 첫걸음 HTML!!</p><!--이것은 주석문-->
	</body>
</html>

1. <!DOCTYPE html>

문서 형식(Document type)을 정의할때 사용하는 문장입니다. html 문서의 가장 처음에 배치되어 이 문서가 html 문서라고 브라우저에 알려주는 역할을 수행합니다.

2. <html lang="ko">

<html> 태그는 전체 html 문서를 감싸는 태그입니다. HTML 문서에서 단 한 번 사용할 수 있으며, <html>태그 바깥에는 다른 태그가 존재할 수 없습니다. lang="ko"는 이 페이지의 주 언어가 한국어라는 것을 명시합니다.

HTML 문서 내에 간단한 설명을 다는 주석문으로 브라우저에 의해 출력되지 않습니다. 주석문은 페이지 내 아무 곳에나 만들 수 있습니다.

헤드 부분

<head></head>로 둘러싼 부분으로 문서의 제목, 본문을 설명하는 메타 태그들, 자바스크립트 코드와 CSS 스타일 시트 등을 포함하며 문서의 본문은 포함되지 않는다.

바디 부분

문서의 본문으로 <body></body>로 둘러싼다. 이곳은 자바스크립트 코드를 포함할 수 있다. 헤드와 바디 사이에는 아무것도 들어갈 수 없다.

참고 : opentutorials.org/course/2039/10931

기본문법 - 생활코딩

기본문법 2015-12-05 10:57:15

opentutorials.org

*생활코딩을 참고 했습니다.

728x90

저작자표시 (새창열림)

'Web' 카테고리의 다른 글

HTML - form 태그 (0)	2021.02.11
HTML 태그 정리 01 (0)	2021.02.11
HTML이란? (0)	2021.02.11

728x90

HTML?

Hyper Text Markup Language의 약자로

하이퍼 텍스트(Hypertext)는 하이퍼 링크를 이용해 독자가 원하는 순서에 따라 기존 문서에서 다른 문서로 접근할 수 있는 텍스트입니다. 쉽게 말해 링크라는 길을 통해 원하는 페이지로 도착하는 방식입니다.

장점으로 하이퍼 텍스트는 다른 텍스트들과 다중으로 연결되어 사용자가 원하는 정보에 바로 접근할 수 있습니다.

- 함께 성장하는 LOCS -

easy-day.tistory.com/

EasyDay

해킹에 철학을 담다

easy-day.tistory.com

Developer's

예비 개발자 장원익의 블로그

wonit.tistory.com

MAPU

마푸(최재웅)의 개발 블로그

dvlpmapu.tistory.com

마크업(Mark Up)은 어떠한 표시를 뜻합니다. 우리가 구분을 할 때 혹은 명시할 때 표시를 하지 않고 표현하는데 어려움이 많습니다. 마크업 언어는 문서나 데이터의 구조를 표현합니다.

<타이틀> 대학생활이 끝난다면 </타이틀>
<부제목> 앞으로 계획 </부제목>
<내용> 가능한 계획과 불가능한 계획 </내용>

HTML에 요소는 시작 태그, 종료 태그, 컨텐츠로 구성되어있습니다.

시작 태그는 <>감싸 내용의 시작을 표시,

종료 태그는 </>로 내용의 끝을 표시합니다.

참고 : opentutorials.org/course/2039/10931

*생활 코딩 사이트를 참고하여 공부했습니다.

728x90

저작자표시 (새창열림)

'Web' 카테고리의 다른 글

HTML - form 태그 (0)	2021.02.11
HTML 태그 정리 01 (0)	2021.02.11
HTML 페이지 기본 (0)	2021.02.11

728x90

- 숨겨진 이라는 뜻으로 Hidden 문제이다.

- 4가지 버튼이 존재하며 '5번 파일에 플래그가 있다악!!!!!!!!!' 문구가 적혀있다.

- 버튼은 4개만 존재하고 5번째 버튼이 없기 때문에 5번째 버튼을 찾으면 플래그 값을 얻을 수 있을거 같다.

- 아쉽게도 버튼을 누르면 'NOP'라는 문구가 적힌 메세지가 뜬다.

- 이때 URL을 보면 id=2이라는 값이 적혀 있다.

- 다른 숫자를 누를 경우 해당 값이 버튼 숫자와 동일하다는 것을 알 수 있다.

name="id" value="1"을 get 방식으로 사용하고 있다.

그렇다면

?id=5를 넣는다면 >????

5번째 버튼을 대신 하는것이라고 생각한다.

정답 : HackCTF{idx_is_so_s1m3le_ctf}

728x90

저작자표시 (새창열림)

'워게임 > Hack_CTF' 카테고리의 다른 글

WEB 문제 '/' (0)	2021.02.09

728x90

- 50점 짜리 문제이다. 빠르게 풀어보자!!

- 링크를 클릭하면 로봇 사진과 Hidden Flag 라는 문구가 적혀있다.

- 웹 페이지 소스코드를 보자!

- 일반 사이트에서 사진을 가져온것으로 보인다.

- 2020년 XFFF CTF에서 이와 같이 로봇 사진을 주고 문제를 풀었던 경험이 있다.

robots.txt ?

이번 문제는 robots.txt 취약점에 대한 문제를 바탕으로 풀어야 한다.

그렇다면 robots.txt는 무엇일까?

- 로봇 배제 표준으로 로봇 배제 프로토콜은 웹 사이트에 로봇이 접근하는 것을 방지하기 위한 규약이다!

- 로봇 접근에 대한 제한을 robots.txt에 기술한다.

- 정리하면 웹 페이지에 봇, 로봇과 같이 자동화 기능을 탑재한 기술을 막기 위한 규정으로 생각하면 된다.

robots.txt 취약점

로봇에게 어떤곳에 접근을 제한하겠다는 정보가 담겨있기 때문에 robots.txt 는 비공개로 해야한다.

다시 문제를 풀어보자

URL에 robots.txt 입력해서 접근해 보았다.

그 결과

플래그 위치를 알려주는 정보가 나왔다.

정답은 : HackCTF{w3lcome_to_s1mple_web_h3cking!}

가장 기초 문제로 재미있던 문제였다.

728x90

저작자표시 (새창열림)

'워게임 > Hack_CTF' 카테고리의 다른 글

WEB 문제 'Hidden' (0)	2021.02.09

728x90

문제 11. 실수형float로 변수를 선언하고 그 변수에 실수값을 저장한 후 저장되어 있는 실수값을 출력해보자!

- 진짜 이거 푸는데 하루 다쓴거 같다... 아니 문제 설명에서 소수점 몇자리 까지 구하라는 언지를 해줬다면 쉽게 풀었을 것을...

- '%6f'는 소수점 6자리까지 출력해준다는 뜻이다.

문제 12. 정수 int 2개를 입력받아 그대로 출력해보자!

- 우리는 map에 사용법을 배웠다. map은 함수와 반복 가능한 자료형을 입력으로 받아. 한꺼번에 모두 int로 변환해준다. 아주 유용하다! 나중에 리스트와 튜플에서 많이 쓰인다.

문제 13. 문자 2개 입력받아 순서 바꿔 출력하기(설명)

- str 문자형으로 입력 input을 받아서 출력을 바꾼 순서로 b, a로 출력해준다.

문제 14. 실수 입력받아 둘째 자리까지 출력하기

- float 실수형으로 input을 받아 소수 세번째 자리에서 반올림을 해주는 '%0.2f'를 출력해 주었다.

문제 15. 정수 1개 입력받아 3번 출력하기

- 정수형 int로 입력을 받아 출력을 세번 진행했다.

728x90

저작자표시 (새창열림)

'프로그래밍 > 파이썬 문제 100' 카테고리의 다른 글

문제 16~21 (0)	2021.02.13
문제 1~10 (0)	2021.02.01

728x90

파이썬에서 딕셔너리 키-값 쌍 추가 기능이 있다.

이러한 기능을 하는 대표적인 딕셔너리 메서드가 있는데 배워보자!!

setdefault : 키-값 쌍추가
update : 키의 값 수정, 키가 없으면 키-값 쌍 추가

1. 딕셔너리에 키와 기본값 저장하기

setdefault(키)는 딕셔너리에 키-값 쌍을 추가한다.

>>> x = {'a': 10, 'b': 20, 'c': 30, 'd': 40}
>>> x.setdefault('e') # 키만 지정하면 None 을 저장
>>> x
{'a': 10, 'b': 20, 'c': 30, 'd': 40, 'e': None}

>>> x.setdefault('f', 100) # 키, 기본값 지정으로 값에 기본값 저장 후 반환
100
>>> x
{'a': 10, 'b': 20, 'c': 30, 'd': 40, 'e': None, 'f': 100}

2. 딕셔너리에서 키의 값 수정하기

update(키=값)은 이름 그대로 딕셔너리에서 키의 값을 수정한다.

>>> x = {'a': 10, 'b': 20, 'c': 30, 'd': 40}
>>> x.update(a=90) # a에 값은 10이지만 90이라는 값으로 수정
>>> x
{'a': 90, 'b': 20, 'c': 30, 'd': 40}

+ 만약 딕셔너리에 키가 존재 하지 않는다면 자동으로 키와 값 추가

>>> x.update(e=50)
>>> x
{'a': 90, 'b': 20, 'c': 30, 'd': 40, 'e': 50}

+ 콤마로 구분해주면 값을 한꺼번에 수정할 수 있다.

>>> x.update(a=18, f=28)
>>> x
{'a': 18, 'b': 20, 'c': 30, 'd': 40, 'e': 50, 'f': 28}

update는 키가 문자열일 때만 사용할 수 있다. 키가 숫자라면?

update( 딕셔너리 ) 처럼 딕셔너리를 넣어서 값을 수정할 수 있다.

>>> y = {1: 'team', 2: 'H4C'}
>>> y.update({1: 'Team', 3: 'good'})
>>> y
{1: 'Team', 2: 'H4C', 3: 'good'}

+ update(리스트), update(튜플)은 리스트와 튜플로 값을 수정한다.

728x90

저작자표시 (새창열림)

'프로그래밍 > 파이썬 기본문법' 카테고리의 다른 글

리스트 메서드, 문자열 메서드, 서식 지정자 자료형 (0)	2021.01.31
UNIT24. 문자열 응용 (0)	2021.01.31
UNIT23. 2차원 리스트 (0)	2021.01.27
+ UNIT22. 리시트와 튜플 응용 (0)	2021.01.27
+ UNIT 22. 리스트와 튜플 응용 2부 (0)	2021.01.26