<input type="datetime">
<input type="week">
<input type="month">
<input type="date">
<input type="time">
<input type="datetime-local">
<input type="email">
<input type="url">
=> 외관은 text Type과
다르지 않지만, 모바일에서 보았을 때, 자판이 다르게 나타난다(한글과 영문은 다를수 있음)
<input type="color">
<input type="search">
=> 외관은 text Type과
다르지 않지만, 모바일에서 보았을 때, 자판이 다르게 나타난다(한글과 영문은 다를수 있음)
<input type="number" min="1"
max="100"> => 모바일에서 보았을 때 차이점이 두드러짐.
<input type="range" min="0"
max="100" step="10" value="0">
=> Slide Control 방식이다.
<input type="tel"> => 모바일에서
보았을 때 숫자키패드가 크게 나타남.
<input type="file" accept="image/*"
multiple>
=> file Type 의 경우 예전에는 하나의 input Tag 에 하나의 파일만 선택할 수 있었다.
하지만 HTML 5 에서는
multiple 속성을 주어 여러 파일들을 선택할 수 있고 accept 속성을 사용하여 MIME type 을 선택하여 파일들을 filtering 할 수 있다.
<input type=”text” name="w" placeholder="Email 을 적어주셔요.">
=> TextBox 에 미리
Text을 넣어 두는 것으로 사용자가 Click 을 하거나 Control 에 Focus 가 가게되면 Placeholder Text 는 사라지게 된다.
이젠 이 기능을 javascript 의 도움없이도 사용할 수 있게
되었다.
<input type=”text” name="w" autofocus>
=> 이전의
javascript 기능의
onload="document.getElementById("w").focus의 기능과 동일하다.
formaction
formaction
속성을 사용하면
Page Form 의 action 이 되는 대상 Page에
가기젂에 input Element 단에서 대상 Page 를
바꾸어 버릯수 있다.
<form action="woolla.aspx"
method="post">
<input type="submit" formaction="woojja.aspx" value="Submit" />
</form>
위 Markup 의 내용을 보면 "woolla.aspx"페이지로 이동할 것이 "woojja.aspx"
페이지로 이동하게 된다.
새로 추가된 Element
Keygen
Element
Keygen
Element 는
form 을 젂송할 때 키를 생성하는 Control 입니다. form 이 젂송되면 비밀키와 공개 키를 생성하여 비밀키는 Client 측에
저장하고 공개키는 서버에 젂송한다. HTML 5 에서 규정하는 Key
의 Type 은 "RSA" 뿐이므로 keytype 속성에는 "rsa" 맊을 사용할 수
있습니다. 지정하지 않아도 기본값으로 지정한다.
<keygen name="key" type="rsa">
Output
Element
Output
Element 는 무얶가의 계산 결과를 나타 낸다. range Element 와 output Element 를 함께
사용하는 예를 살펴본다.
<input type="range" id="rng"
value="0"><output
onformchange="value=form.elements.rng.value"
for="rng">0</output>
output Element value 속성을 넣을 수 없으므로 주의가
필요하다.
progress
Element
Progress
Element 는 작업의 짂행정도를 나타낸다.
<progress value="0.75"
max="1">0</progress>
meter
meter
Element 는 한정된 범위에서의 값을 나타내고
싶을때 사용하는 것으로 최소값과 최댓값을 지정할 수 없는 곳에서는 meter Element 를 사용할
수 없다.
<meter value="25" min="0"
low="30" high="70" max="100"
optimum="100">25점</meter>