✨type 속성 : 입력값의 형식을 속성값으로 설정
type 속성값의 종류
hidden : 사용자로부터 값을 입력받지 않고 요청 웹프로그램에게 필요한 값 전달
text : 사용자로부터 문자값을 입력받아 전달
password : 사용자로부터 문자값을 입력받아 전달 - 입력값이 특정문자로 변환되어 표시
radio : name 속성값이 같은 입력태그 중 하나를 선택하여 전달
checkbox : name 속성값이 같은 입력태그 중 1개 이상을 선택하여 전달
file : 파일을 입력받아 전달
email(HTML5) : 이메일을 입력받아 전달 - 이메일 형식에 대한 검증 처리
number(HTML5) : 숫자 형식의 문자값을 입력받아 전달(증가 또는 감소 버튼 제공) - 숫자 형식외의 값은 입력 붉가능(최소값 또는 최대값 검증 처리)
tel(HTML5) : 전화번호 형식의 문자값을 입력받아 전달 - 스마트기기의 입력패드 변경
url(HTML5) : URL 주소 형식의 문자값을 입력받아 전달 - 스마트기기의 입력패드 변경
search(HTML5) : 검색 관련 문자값을 입력받아 전달 - 스마트기기의 자동완성 기능 사용
color(HTML5) : 색을 입력받아 색상값(#RRGGBB)을 전달 - 색 선택 가능
range(HTML5) : 등급을 입력받아 전달 - min 속성값과 max 속성값으로 범위 설정
date(HTML5) : 날짜(년-월-일)를 입력받아 전달 - 달력을 이용하여 날짜 입력 가능
time(HTML5) : 시간({오전|오후}시:분)를 입력받아 전달 - 시계를 이용하여 시간 입력 가능
datetime-local(HTML5) : 날짜(년-월-일)와 시간({오전|오후}시:분)를 입력받아 전달 - 달력과 시계 이용
name 속성 : 태그의 이름을 속성값으로 설정 - 웹프로그램에게 값을 전달할 때 사용하는 식별자 역활 수행
value 속성 : 입력태그의 초기값을 속성값으로 설정
size 속성 : 입력태그의 크기(폭)을 속성값으로 설정
maxlength 속성 : 입력태그에 입력 가능한 최대 문자 갯수를 속성값으로 설정
autofocus 속성(HTML5) : 입력태그에 입력촛점(Focus)을 위치 시키는 속성 - 속성값 생략 가능
required 속성(HTML5) : 필수 입력값을 설정하기 위한 속성 - 속성값 생략 가능
required 속성이 설정된 입력태그에 입력값이 없는 경우 웹프로그램 요청 불가능
placeholder(HTML5) : 입력태그의 입력값에 대한 설명을 속성값으로 설정
placeholder 속성이 설정된 입력태그에 값을 입력하면 설명은 자동 소멸
readonly 속성 : 입력태그를 읽기 전용으로 설정하는 속성 - 속성값 생략 가능
disabled 속성 : 입력태그를 비활성화 처리하는 속성 - 속성값 생략 가능
checked 속성 : 우선 선택 설정 속성(radio 또는 checkbox) - 속성값 생략 가능
min 속성(HTML5) : 입력태그의 최소 입력값을 속성값으로 설정
max 속성(HTML5) : 입력태그의 최대 입력값을 속성값으로 설정
<form action="#" method="post">
<input type="hidden" name="num" value="1000">
<p>아이디 : <input type="text" name="id" size="10" maxlength="20"
autofocus="autofocus" required="required"></p>
<p>비밀번호 : <input type="password" name="passwd" placeholder="형식에 맞는 비밀번호 입력"></p>
<p>이름 : <input type="text" name="name" value="홍길동" readonly="readonly"></p>
<p>성별 : <input type="radio" name="gender" value="남자">남자
<input type="radio" name="gender" value="여자" checked="checked">여자</p>
<p>취미 : <input type="checkbox" name="hobby" value="독서">독서
<input type="checkbox" name="hobby" value="등산">등산
<input type="checkbox" name="hobby" value="낚시">낚시
<input type="checkbox" name="hobby" value="게임">게임</p>
<p>사진 : <input type="file" name="profile"></p>
<p>이메일 : <input type="email" name="email"></p>
<p>나이 : <input type="number" name="age" min="1" max="200"></p>
<p>전화번호 : <input type="tel" name="phone"></p>
<p>SNS : <input type="url" name="sns"></p>
<p>검색 : <input type="search" name="keyword"></p>
<p>좋아하는 색 : <input type="color" name="color"></p>
<p>실력 : 하 <input type="range" name="grade" min="1" max="5">상</p>
<p>생년월일 : <input type="date" name="birthday"></p>
<p>기상시간 : <input type="time" name="uptime"></p>
<p>알람 : <input type="datetime-local" name="alram"></p>
</form>
