HTML <옵션> 태그
예시
네 가지 옵션이 있는 드롭다운 목록:
<label for="cars">Choose a car:</label>
<select id="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
아래에서 더 많은 "직접 사용해 보기" 예를 살펴보세요.
정의 및 사용
<option>태그는 선택 목록의 옵션을 정의합니다 .
<option>요소는 <select> ,
<optgroup> 또는 <datalist> 요소 내부로 이동합니다.
참고: 태그 는 <option>속성 없이 사용할 수 있지만 일반적 으로 양식 제출 시 서버로 전송되는 내용을 나타내는 값 속성이 필요합니다.
팁: 옵션 목록이 긴 경우 <optgroup> 태그 내에서 관련 옵션을 그룹화할 수 있습니다 .
브라우저 지원
| Element | |||||
|---|---|---|---|---|---|
| <option> | Yes | Yes | Yes | Yes | Yes |
속성
| Attribute | Value | Description |
|---|---|---|
| disabled | disabled | Specifies that an option should be disabled |
| label | text | Specifies a shorter label for an option |
| selected | selected | Specifies that an option should be pre-selected when the page loads |
| value | text | Specifies the value to be sent to a server |
전역 속성
<option>태그는 HTML의 전역 속성도 지원 합니다 .
이벤트 속성
<option>태그는 HTML의 이벤트 속성 도 지원합니다 .
더 많은 예
예시
<datalist> 요소에서 <option> 사용:
<label for="browser">Choose your browser from the list:</label>
<input list="browsers" name="browser" id="browser">
<datalist id="browsers">
<option value="Edge">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
예시
<optgroup> 요소에서 <option> 사용:
<label for="cars">Choose a car:</label>
<select id="cars">
<optgroup label="Swedish Cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</optgroup>
<optgroup label="German Cars">
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
</select>
관련 페이지
HTML DOM 참조: Option 개체
기본 CSS 설정
없음.