텍스트 입력
<input type="text">: 한 줄 입력 창
="password">: 암호 입력 창
name: 요소 이름
size: 입력 창의 크기 (단위: 문자 개수)
maxlength: 입력할 수 있는 문자의 최대 개수
value: 초기 텍스트
<textarea>: 여러 줄 입력 창
cols, rows: 텍스트 입력창의 크기, 가로세로 문자 수
name: 요소 이름
wrap(OFF | HARD | SOFT): 자동 줄바꿈 처리 설정
<br> 태그를 사용해 아이디와 비밀번호를 입력받는 칸이 두 줄로 나누어지도록 코드를 작성했다.
size 값을 설정해 입력 칸의 크기를 조절하고, submit의 value 값을 완료로 별도 설정하였다. (default=제출)
maxlength를 6으로 설정해 6글자 이상 입력하지 못하도록,
주민등록번호 name 속성을 idnumber로 설정. value를 123456으로 설정, readonly 속성을 활성화시켜보았다.
그러자 주민등록번호의 초기값으로 설정된 123456이 수정되지 않는다.
cf) 실명 인증 등에서 자주 쓰이는 것
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<form>
주민등록번호 앞 6자리 입력<br>
<input type="text" size="6" maxlength="6" name="idnumber" value="123456" readonly> <br>
<hr>
사용자 ID: <input type="text" size="10"><br>
비밀 번호: <input type="password" size="10"><br>
자기소개: <textarea cols=20 rows="5" wrap="off">이곳에 자기소개서 작성
</textarea>
<input type="submit" value="완료">
</form>
</body>
</html>
'GURU > PYTHON & HTML' 카테고리의 다른 글
| [HTML day 6: CSS3 스타일 시트] CSS3 스타일 시트로 꾸민 웹페이지 (0) | 2022.01.22 |
|---|---|
| [HTML day 5: web form] HTML에서의 색 표현 (0) | 2022.01.21 |
| [HTML day 5: 시맨틱 태그] <details> 및 <summary> 태그 (0) | 2022.01.19 |
| [HTML day 5: 시맨틱 태그] 구조화된 HTML5 문서 작성 (0) | 2022.01.19 |
| [HTML day 4: 테이블 만들기] <table> (0) | 2022.01.18 |