input 태그

input태그는 사용자의 정보를 받는 요소들을 생성한다.

 

<form action="/user_update.php" method="get">
	<label for="username">이름:</label>
	<input type="text" id="username" name="username"><br><br>
	<label for="userage">나이:</label>
	<input type="text" id="userage" name="userage"><br><br>
	<input type="submit" value="등록">
</form>

 

input태그는 주로 form태그 안에서 type의 종류에 따라 다르게 표현된다.

type의 종류 : button, checkbox, color, date, datetime-local, email, file, hidden, image, month, number, password, radio, range, reset, search, submit, tel, text, time, url, week

 

Attribute	Value	Description
accept	file_extension audio/* video/* image/* media_type	업로드 할 파일 타입 필터 설정(type="file"에서만 사용)
alt	text	이미지 대체 문자 설정 (type="image"에서만 사용)
autocomplete	on off	자동 완성 여부 설정
autofocus	autofocus	자동 선택 여부 설정
checked	checked	첵크박스나 라디오버튼의 선택 여부 설정(type="checkbox" 또는 type="radio"에서만 사용)
dirname	inputname.dir	입력된 데이터의 문자 진행방향 설정
disabled	disabled	input요소의 사용 여부 설정
form	form_id	input요소가 해당하는 form아이디 설정
formaction	URL	데이터 전송 시 전송될 곳 설정 (type="submit" 또는 type="image"에서만 사용)
formenctype	application/x-www-form-urlencoded multipart/form-data text/plain	폼 데이터의 encoded 타입 설정 (type="submit" 또는 type="image"에서만 사용)
formmethod	get post	폼 데이터 전송 방식 설정 (type="submit" 또는 type="image"에서만 사용)
formnovalidate	formnovalidate	폼 데이터 전송 시 유효성 검사 여부 설정
formtarget	_blank _self _parent _top framename	폼 데이터가 전송 된 후 표시된 프레임 이름 설정 (type="submit" 또는 type="image"에서만 사용)
height	pixels	input요소의 높이 설정 (type="image"에서만 사용)
list	datalist_id	input요소의 datalist요소의 아이디 설정
max	number date	입력 데이터의 최고값 설정
maxlength	number	입력 데이터의 최고 문자 길이 설정
min	number date	입력 데이터의 최소값 설정
minlength	number	입력 데이터의 최소 문자 길이 설정
multiple	multiple	하나 이상의 데이터 입력 여부 설정/td>
name	text	input요소의 이름 설정
pattern	regexp	입력 데이터의 유효성(정규표현식) 설정
placeholder	text	input요소에 입력될 데이터의 간단한 설명구 설정
readonly	readonly	읽기 전용 여부 설정
required	required	필수 입력 여부 설정
size	number	문자 길이 설정
src	URL	버튼 이미지 경로 설정 (type="image"에서만 사용)
step	number any	증가 / 감소 값 설정
type	button checkbox color date datetime-local email file hidden image month number password radio range reset search submit tel text time url week	input요소의 종류 설정
value	text	input요소의 값 설정
width	pixels	input요소의 넓이 설정 (type="image"에서만 사용)