Notice
Recent Posts
Recent Comments
«   2024/05   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
Archives
Today
Total
관리 메뉴

DeFacto-Standard IT

[HTML] Form 본문

Web/HTML

[HTML] Form

defacto standard 2017. 12. 17. 01:44

태그

설명

속성

<form></form>

서버단에 보낼 form임을 기술.

 - name : form의 이름 지정

 - method : GET/POST 등 지정

get의 경우 input태그의 name값이 key값으로, , value값이 value값으로 이어진다.

post의 경우 Request Body에 key, value가 들어간다.

 - action : submit 시 폼을 보낼 URL 기술

 - target : 출력 윈도우명

 - enctype : 폼 데이터를 웹 서버로 전송 시 암호화 방식 지정

<button></button>

버튼

 - type : 버튼의 타입 지정.

button : 일반 버튼

submit : 서버단으로 전송

 - onclick : 클릭 시 행동 기술.(자바스크립트)

<input>

입력 태그

 - type : input태그의 타입 지정.

text : 한 줄 텍스트 입력창

password : 압호 입력 한 줄 텍스트 입력창

button : 단순 버튼

submit : 폼 전송 버튼

reset : 입력된 폼 데이터를 초기화

image : 이미지 버튼

radio : 라디오 버튼(checked(단일) 기술 시 기본 체크, 중복 불가)

checkbox : 체크박스 버튼(checked(단일) 기술 시 기본 체크, 중복 가능)

month | week | data | time | datetime-local

 : 년, 월, 일 ,시간 등 시간 정보 입력.

 "2016-09", 2016-W16", "2019-09-01", "21:30", "2016-09-01T21:30:10.32"

number | range : 스핀 버튼, 슬라이드 바로 편리한 숫자 입력

color : 색을 쉽게 입력하는 컬러 다이얼로그

email | url | tel | search : 이메일, URL, 전화번호, 검색키워드 등 Validation기능을 가진 텍스트 입력창

file : 로컬PC의 파일을 선택하는 폼 요소

 - name : input태그의 이름 지정.

 - value : input태그의 값 지정. 기술 시 초기값 기술

 - id : id값. 상위 항목인label의 for값과 동일

 - size : 문자 갯수

 - maxlength : 최대 문자 갯수

 - list : 엮을 리스트의 이름

 - placeholder : 아무것도 입력하지 않았을 시 텍스트창에 출력할 회색 글씨

<select></select>

드롭다운 리스트

 - name : select 태그의 이름 지정

 - size : 갯수

 - multiple(단일)

<datalist></datalist>

목록 리스트를 작성

 - id : input의 list속성과 일치시켜 input태그 안의 목록 리스트와 엮음

<option></option>

드롭다운 리스트 값 1개

select와 datalist 태그에 포함된다.

 - value : 옵션의 값 지정

 - selected(단일) : 초기 체크

<label></label>

input, img등을 묶어 이미지를 클릭해도 input이 입력되는 등의 행동 기술 가능

 - for :  label을 묶는 이름. 하위항목인 input 등에서 id값과 동일

<textarea></textarea>

텍스트 입력 창(큰 창)

 - cols : textarea의 가로 크기

 - rows : textarea의 세로 크기

<fieldset></fieldset>

폼을 선으로 묶음

 

<legend></legend>

선으로 묶은 폼의 제목을 지정

 

 

'Web > HTML' 카테고리의 다른 글

[HTML] iframe (인라인 프레임)  (0) 2017.12.17
[HTML] 시맨틱 태그, 문서의 구조화  (0) 2017.12.17
[HTML] 테이블  (0) 2017.12.17
[HTML] 리스트  (0) 2017.12.17
[HTML] 메타 데이터  (0) 2017.12.17
Comments