HTML 폼을 구성하는 태그들(form,input,option,textarea,select)

 

form태그 이외의 태그들이 폼에 데이터를 적게된다.

 

input태그

형식을 지정함에 따라 여러 형태의 필드를 폼에 구성 할 수 있다.

 

 

 

형식	속성	설명
text	name	필드를 구분하는 이름
	size	대문자 A를 기준 삼아 필드의 크기(개수)
	value	텍스트를 지정한다
	maxlength	필드에 입력할 수 있는 글자 수(개수)를 제한한다.
	readonly	필드를 읽기 전용으로 지정한다.
password	name	필드를 구분하는 이름
	size	대문자 A를 기준 삼아 필드의 크기(개수)
	maxlength	필드에 입력할 수 있는 글자 수(개수)를 제한한다.
radio/checkbox	name	필드를 구분하는 이름
	value	데이터 값(텍스트)을 지정한다.
	checked	현재항목을 확인할지 여부를 지정한다.
button/submit/reset/hidden	name	필드의 이름(텍스트)을 지정한다.
	value	단추에 표시할 글자(텍스트)를 지정한다.
file	name	필드의 이름(텍스트)을 지정한다.
	size	필드의 크기(숫자)를 지정한다.
	readonly	필드를 읽기 전용으로 지정한다.

 

 input태그 속성

name	입력값에 대한 이름을 결정하는 속성입니다.  나중에 프로그램으로 전달할때 변수명이 되므로 입력값마다 각기 다른 name을 정해줍니다. ※ Type 속성 값이 checkbox나 radio일 때는 각각의 name은 같게 하고, value를 다르게 합니다.
type	입력필드의 타입을 지정하는 속성입니다.
value	입력필드의 기본 값 지정하는 속성입니다.
size	입력 필드의 크기를 픽셀로 지정하는 속성입니다.  ※ Type 속성값이 text나 password일 때는 입력하는 문자의 수가 됩니다.
maxlength	입력필드에 입력할수 있는 문자의 최대값을 나타내는 속성입니다.
checked	Type속성값이 checkbox나 radio일 때 checked속성이 부여되면 해당 입력값이 선택된 상태로 설정됩니다.
src	Type이 image일 때, 사용될 그림 파일의 경로이다.
readonly	입력필드가 읽기 전용이 되는 속성입니다.
disabled	입력필드를 아예 비활성화 하는 속성입니다. 즉 사용자가 입력할수 없는 상태가 됩니다.
tabindex	속성값으로 숫자 값을 가지며 탭키를 사용해 마우스포커스를 옮길때의 순서를 정해줄수 있는 속성입니다.

form태그

자신의 태그내에 있는 데이터를 지정한 웹 경로로 전송해 준다.

 

method - 데이터를 전송하는방식(get,post)지정

name - 폼의 이름지정

action - 폼 내의 데이터를 가지고 이동할 위치(url,jsp같은 프로그램)지정

enctype - 대용량 파일의 데이터 속성(multipart나 form-data)지정

 

select 태그

목록 상자나 콤보박스로 폼을 구성할 때 사용하는 태그이다.

 

name - 필드의 이름(텍스트)을 지정한다.

size - 목록 상자에 보여지는 항목(item)의 개수(숫자)를 지정한다.

multiple - 필드에서 여러항목을 선택할 수 있게 해준다.

 

option 태그

select 태그가 만드는 필드의 항목을 만드는 태그이다.

 

value - 항목을 선택하였을 때 전송할 값을 지정한다.

selected - 기본적으로 선택되는 항목을 지정하게 해준다.

 

textarea 태그

게시판이나 메일처럼 여러줄에 걸쳐 데이터를 작성하고자 할 때 사용하는 태그이다.

 

name - 필드의 이름(텍스트)을 지정한다.

cols  - 대문자 A를 기준으로 개수 만큼의 너비(개수)를 지정한다.

rows -  대문자 A를 기준으로 개수 만큼의 높이(개수)를 지정한다.

readonly - 필드를 일기 전용으로 지정한다.

Label 태그