[HTML5] 폼 관련 요소

log 2015. 6. 5. 15:27

폼 관련 요소

disabled

요소 안의 폼컨트롤을 사용할 수 없도록

<button disabled="disabled"></button>

search

<input type="search" name="search" placeholder="사이트내 검색"/>

submit

<input type="submit" value="검색"/>

tel

<input type="tel" name="tel" placeholder="예)01012345464"/>

email

<input type="email" name="email" placeholder="예)se@gmail.com"/>

url

<input type="url" name="url" value="http://"/>

month

<input type="month" name="month"/>

date

<input type="data" name="bday" max="1979-12-31"/>
<input type="data" name="bday" min="2000-01-02"/>

week

<input type="week" name="date"/>

time

<input type="week" name="date"/>

number

<input type="number" name="points" min="0" max="100" step="10" value="30"/>

color

<input type="color" name="favcolor" value="#ffffff"/>

button

<input type="color" name="favcolor" value="#ffffff"/>

range

<input type="range" name="points" min="0" max="10"/>

datetime-local

크롬 사파리 오페라만 지원

<input type="datetime-local" name="bdaytime"/>

readonly 속성

<input type="text" name="firstname" value="Kon" readonly/>
읽기만 가능

size 속성

<input type="text" name="firstname" value="Kon" size="40"/>

maxlength 속성

<input type="text" name="firstname" maxlength="10"/>

autofocus

<input type="text" name="firstname" autofocus//>

datalist

<input list="browsers" name="browsers"/>
<datalist id="browsers">
  <option value="Internet Exploere">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>

output

<form action="" output="c.value=parseInt(a.value)+parseInt(b.value)">
  <input type="number" id="b" name="b" value="0"/>=
  <output name="c" for="a b"></output>
</form>