<datalist>

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

HTML<datalist> 요소는 다른 컨트롤에서 고를 수 있는 가능한, 혹은 추천하는 선택지를 나타내는<option> 요소 여럿을 담습니다.

시도해 보기

<label for="ice-cream-choice">Choose a flavor:</label><input list="ice-cream-flavors" name="ice-cream-choice" /><datalist>  <option value="Chocolate"></option>  <option value="Coconut"></option>  <option value="Mint"></option>  <option value="Strawberry"></option>  <option value="Vanilla"></option></datalist>

label {  display: block;  margin-bottom: 10px;}

콘텐츠 카테고리	플로우 콘텐츠,구문 콘텐츠.
가능한 콘텐츠	구문 콘텐츠, 또는 0개 이상의`<option>` 요소.
태그 생략	불가능, 시작과 끝에 태그를 추가하는 것은 필수입니다.
가능한 부모 요소	구문 콘텐츠를 허용하는 모든 요소.
암시적 ARIA 역할	`listbox`
가능한 ARIA 역할	없음
DOM 인터페이스	`HTMLDataListElement`

특성

이 요소는전역 특성만 포함합니다.

예제

html

<label for="myBrowser">아래 목록에서 브라우저를 선택하세요:</label><input list="browsers" name="myBrowser" /><datalist>  <option value="Chrome"></option>  <option value="Firefox"></option>  <option value="Internet Explorer"></option>  <option value="Opera"></option>  <option value="Safari"></option>  <option value="Microsoft Edge"></option></datalist>