HTML5 forms

datalist element

input list="local-list" + datalist id="local-list"

output element

form oninput="x.value=parseInt(a.value)+parseInt(b.value)" + = 108
form oninput="y.value=parseInt(c.value)+parseInt(d.value)" + = 100

progress element

progress value="0.5" 0.5/1
50/100

min 속성은 존재하지 않음. max 속성 생략시 기본 값은 1.

meter element

meter value="0.5" 0.5/1
50/100

min/max 속성 생략시 기본 값은 0/1이 된다. 'low, high, optimum' 속성을 사용하면 '낮은 범위, 높은 범위, 적정 값'을 명시할 수 있음.

input [type] attributes

input type="search"
input type="tel"
input type="url"
input type="email"
input type="number"
input type="date"
input type="month"
input type="week"
input type="time"
input type="datetime-local"
input type="range"
input type="color"
input type="file" accept="image/*"

input attributes

input required

반드시 입력해야 합니다.

input autocomplete="on"
input autocomplete="off"
input autofocus="autofocus"
input placeholder="abc@abc.com"
input list="local-list" + datalist id="local-list"
input min="0" max="10"
input minlength="4" maxlength="8"
input step="10"
input type="email" multiple

쉼표(,)로 분리한 이메일 주소 목록.

input type="file" multiple
select multiple

cmd 또는 ctrl 키를 누른 상태로 여러 개의 값을 선택할 수 있다.

input pattern="[0-9][0-9][0-1][0-9][0-3][0-9]-[1-4][0-9][0-9][0-9][0-9][0-9][0-9]"

가상의 주민등록번호 입력 가능. 예) 000000-1000000

select element

select, option
select, optgruop, option