반응형
1. 폼에서 사용하는 태그
|
<form>
|
폼의 시작과 끝을 만듭니다.
|
|
<fieldset>
|
폼 요소를 그룹으로 묶습니다.
|
|
<legend>
|
필드셋에 제목을 붙입니다.
|
|
<input>
|
사용자가 내용을 입력할 필드를 삽입합니다.
(input type속성태그는 아래 정리.) |
|
<select>, <option>
|
드롭다운 목록을 삽입합니다.
|
|
<textarea>
|
텍스트를 여러 줄 입력할 수 있는 텍스트 영역을 삽입합니다.
|
|
<datalist>
|
데이터 목록을 삽입합니다.
|
2. <input> 태그의 유형(type)
|
text
|
입력할 수 있는 한줄짜리 텍스트 상자
|
|
password
|
비밀번호를 입력할 수 있는 필드
|
|
search
|
검색할때 입력 하는 필드
|
|
url
|
url 입력필드
|
|
email
|
|
|
tel
|
연락처 입력필드
|
|
checkbox
|
주어진 여러 항목에서 2개 이상 선택할 수 있는 체크박스
|
|
radio
|
주어진 여러 항목에서 1개만 선택
|
|
number
|
숫자를 조절할 수 있는 스핀박스
|
|
range
|
숫자를 조절 할 수 있는 슬라이드 막대
|
|
date
|
사용자 지역을 기준으로 날짜(연,월,일)
|
|
month
|
사용자 지역을 기준으로 날짜(연, 월)
|
|
week
|
사용자 지역을 기준으로 날짜(연, 주)
|
|
time
|
사용자지역을 기준으로 시간
|
|
datetime
|
국제 표준시 날짜, 시간
|
|
datetime-local
|
사용자 기준 날짜, 시간
|
|
submit
|
전송 버튼
|
|
reset
|
리셋 버튼
|
|
image
|
submit 대신에 사용할 이미지
|
|
file
|
파일을 첨부 할 수 있는 버튼
|
|
button
|
일반 버튼
|
|
hidden
|
사용자에게는 보이진 않지만 value 속성을 통해 서버에 값을 넘겨줌.
|
3. input 태그의 속성
|
autofocus
|
웹 문서가 열리면 입력 필드 안에 마우스 포인터를 표시
|
|
placeholder
|
텍스트 필드에 힌트표시
|
|
readonly
|
읽기 전용
|
|
required
|
필수 입력
|
|
max
|
숫자 입력 필드에서 최대값 지정
|
|
min
|
숫자 입력 필드에서 최솟값 지정
|
|
step
|
숫자 입력 필드에서 증감할 간격 지정
|
|
maxlength
|
텍스트 관련 필드에서 입력할 수 있는 최대 길이 지정
|
|
minlength
|
텍스트 관련 필드에서 입력할 수 있는 최소 길이 지정
|
|
size
|
텍스트 관련 필드에서 화면에 표시할 크기 지정
|
|
list
|
연결할 데이터 목록을 지정
|
반응형