비밀번호는 보안이 중시되는 데이터의 입력을 받는다.
예제
<!DOCTYPE html><html>
<head>
<title>네이버</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
</head>
<body>
<form action="url" method="GET">
비밀번호 :
<input type="password" name="password" />
<br />
<input type="submit" />
</form>
</body>
</html>
예제 설명
예제를 html 파일에 코딩하여 실행하면 아래 그림과 같은 웹페이지가 나온다.
input type을 password로 지정하였기 때문에 텍스트 입력창에 입력을 해도 평문으로 보이지 않는다.
hidden data는 화면상에 표시되지 않는 컨트롤을 생성하고, 서버로 전달할 데이터지만 사용자에게 노출할 필요가 없는 데이터인 경우 사용한다.
예제
<html>
<head>
<title>네이버</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
</head>
<body>
<form action="url" method="GET">
이름 :
<input type="text" name="name" />
<input type="hidden" name="language" />
<br />
<input type="submit" />
</form>
</body>
</html>
예제 설명
예제를 html 파일에 코딩하여 실행하면 아래 그림과 같은 웹페이지가 나온다.
위와 같이 input type을 text로 지정한 것만 보이고 hidden으로 지정해놓은 것은 안보인다.
textarea는 여러줄의 텍스트를 입력할 때 사용한다.
문법
<textarea name="값의 이름" rows="행의 수" cols="열의 수" disabled="disabled" readonly="readonly">값</textarea>
- rows : 입력한 행의 수 만큼 높이가 정해짐
- cols : 입력한 열의 수 만큼 폭이 정해짐.
예제
<!DOCTYPE html>
<html>
<head>
<title>네이버</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
</head>
<body>
<form action="url" method="GET">
내용 : <br />
<textarea rows="5" cols="20"></textarea> <br />
<input type="submit" />
</form>
</body>
</html>
예제 설명
예제를 html 파일에 코딩하여 실행하면 아래 그림과 같은 웹페이지가 나온다.
rows가 5이기 때문에 5줄이 생성되고, cols가 20이므로 20칸 짜리 텍스트 입력 받는 곳이 생성되었다.
'Programming > HTML' 카테고리의 다른 글
| 콤보 박스 (0) | 2017.12.12 |
|---|---|
| 라디오 버튼 (0) | 2017.12.11 |
| 폼(form), 텍스트 입력 (0) | 2017.12.11 |
| head, meta, title (0) | 2017.12.11 |
| 표 (0) | 2017.12.11 |
꼴통보안인