W3Schools HTML5 튜토리얼 (한글) -10

W3Schools HTML5 튜토리얼

HTML5 홈
HTML5 소개
HTML5 새 엘리먼트 (Elements)
HTML5 비디오 (Video)
HTML5 비디오/Dom (Video/DOM)
HTML5 오디오 (Audio)
HTML5 캔버스 (Canvas)
HTML5 웹 저장공간 (Web Storage)

HTML5 폼 (Forms)

HTML5 입력타입 (Input Types)
HTML5 폼 엘리먼트 (Form Elements)
HTML5 폼 속성 (Form Attributes)

HTML5 참조목록 (Reference)

HTML5 태그 (Tags)
HTML5 속성 (Attributes)
HTML5 이벤트 (Events)
HTML5 2D 캔버스 (Canvas 2d)
HTML 유효 DTD (Valid DTDs)

---

HTML5 새 폼 엘리먼트들

HTML5 폼은 새 엘리먼트와 속성을을 가지고 있습니다.

이 장에서 언급할 새 폼 엘리먼트들:

• <datalist>
• <keygen>
• <output>

---

지원하는 브라우저

태그	익스플로러	파이어폭스	오페라	크롬	사파리
<datalist>	No	4.0	9.5	No	No
<keygen>	No	4.0	10.5	3.0	No
<output>	No	4.0	9.5	10.0	5.1

---

<datalist> 엘리먼트

<datalist> 엘리먼트는 입력창의 옵션 리스트를 서술합니다.

이 리스트는 <datalist>내에서 <option> 엘리먼트와 같이 만들어집니다.

입력창에서 <datalist>를 사용하려면(bind), 입력창의 목록속성에 datalist의 아이디를 쓰면 됩니다:

예제

Webpage: <input type="url" list="url_list" name="link" />
<datalist id="url_list">
<option label="W3Schools" value="http://www.w3schools.com" />
<option label="Google" value="http://www.google.com" />
<option label="Microsoft" value="http://www.microsoft.com" />
</datalist>

직접 해보기 »

팁: <option> 엘리먼트는 항상 value 속성값을 가져야 합니다.

---

<keygen> 엘리먼트

<keygen> 엘리먼트의 목적은 유저를 안전하게 인증하기 위함입니다.

<keygen> 엘리먼트는 key-pair generator입니다. 폼이 submit될때, 두개의 키다 생성되며 하나는 private, 다른 하나는 public입니다.

private 키는 클라이언트에 저장되고, public 키는 서버로 보내집니다. public 키는 차후 유저를 인증하기 위한 클라이언트 인증서를 만드는데 사용됩니다.

현재 이 엘리먼트를 지원하는 브라우저는 유용한 보안 표준안이 될만큼 충분하지 않습니다.

예제

<form action="demo_form.asp" method="get">
Username: <input type="text" name="usr_name" />
Encryption: <keygen name="security" />
<input type="submit" />
</form>

직접 해보기 »

---

<output> 엘리먼트

<output> 엘리먼트는 스크립트나 연산출력물같은 다른 타입의 출력을 위해 사용됩니다.

예제

<form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
<input type="range" name="a" value="50" />100
+<input type="number" name="b" value="50" />
=<output name="x" for="a b"></output>
</form>

직접 해보기 »

---

HTML5 새 폼 엘리먼트들

태그	설명
<datalist>	입력창의 옵션리스트를 정의함
<keygen>	key-pair generator 필드를 정의함
<output>	연산의 결과를 표현함