<optgroup>
Baseline Widely available *
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015년 7월.
* Some parts of this feature may have varying levels of support.
HTML <optgroup> 요소는 <select> 요소의 옵션을 묶을 수 있습니다.
시도해 보기
<label for="dino-select">Choose a dinosaur:</label> <select id="dino-select"> <optgroup label="Theropods"> <option>Tyrannosaurus</option> <option>Velociraptor</option> <option>Deinonychus</option> </optgroup> <optgroup label="Sauropods"> <option>Diplodocus</option> <option>Saltasaurus</option> <option>Apatosaurus</option> </optgroup> </select> label { display: block; margin-bottom: 10px; } | 콘텐츠 카테고리 | 없음. |
|---|---|
| 가능한 콘텐츠 | 0개 이상의 <option> 요소. |
| 태그 생략 | 여는 태그는 필수입니다. 바로 뒤따르는 요소가 다른 <optgroup>이거나, 자신이 부모의 마지막 자식이라면 닫는 태그를 생략할 수 있습니다. |
| 가능한 부모 요소 | <select> 요소. |
| 가능한 ARIA 역할 | 없음 |
| DOM 인터페이스 | HTMLOptGroupElement |
참고 : <optgroup> 요소는 중첩할 수 없습니다.
특성
이 요소는 전역 특성을 포함합니다.
예제
html
<select> <optgroup label="Group 1"> <option>Option 1.1</option> </optgroup> <optgroup label="Group 2"> <option>Option 2.1</option> <option>Option 2.2</option> </optgroup> <optgroup label="Group 3" disabled> <option>Option 3.1</option> <option>Option 3.2</option> <option>Option 3.3</option> </optgroup> </select> 결과
명세
| Specification |
|---|
| HTML # the-optgroup-element |