HTML 참조 매뉴얼

HTML 태그 전체 목록

HTML: <optgroup> 태그

HTML <optgroup> 태그는 <select> 컨트롤의 값 드롭다운 목록에서 옵션 그룹을 생성합니다. 이 드롭다운 값은 <option> 태그로 정의되며, <optgroup> 태그로 그룹화됩니다. <optgroup>의 값은 <select> 컨트롤에서 그룹화된 항목 위에 회색 제목으로 표시됩니다. 이 태그는 일반적으로 <optgroup> 요소로도 알려져 있습니다.

온라인 예제

<optgroup> 태그를 사용하여 관련 옵션을 그룹화하세요：

예제

!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>HTML　optgroup 태그의 사용(기본 튜토리얼 웹 oldtoolbag.com)</title>
</head>
<body>
　　<label for="tutorial_choice">Tutorials:　</label>
　　<select id="tutorial_choice">
　　　　<optgroup label="Web">
　　　　　　<option value="html">HTML</option>
　　　　　　<option value="css">CSS</option>
　　　　</optgroup>
　　　　<optgroup label="Database">
　　　　　　<option value="sql">SQL</option>
　　　　　　<option value="oracle">Oracle</option>
　　　　</optgroup>
　　</select>
</body>
</html>

테스트를 보세요 ‹/›

이 HTML5문서 예제에서는 <optgroup> 태그를 사용하여 드롭다운 목록에서 두 개의 옵션 그룹을 생성했습니다. 첫 번째 옵션 그룹의 제목은 Web로, 두 개의 드롭다운 값이 포함되어 있습니다.-HTML과 CSS.-SQL과 Oracle.

브라우저 호환성

IEFirefoxOperaChromeSafari

대부분의 주요 브라우저가 <optgroup> 태그를 지원합니다.

태그 정의 및 사용 설명

<optgroup> 태그는 <option> 태그 그룹을 그룹 제목을 가진 옵션 그룹으로 조직합니다.

label <optgroup>의 값은 회색 제목으로 표시됩니다. 모든 그룹된 항목은 제목 아래에 인쇄된 인쇄된 옵션 목록으로 표시됩니다.

기본적으로, <select> 태그 내의 첫 번째 옵션이 선택된 항목으로 표시됩니다. 사용자는 드롭다운 목록에서 다른 옵션을 선택할 수 있습니다.

여러 옵션 그룹이 많다면, <optgroup> 태그를 사용하여 관련 옵션을 간단하게 그룹화할 수 있습니다.

속성

속성	값	설명
disabled	disabled	이 옵션 그룹을 비활성화합니다.
label	text	옵션 그룹에 설명을 지정합니다.

전역 속성

<optgroup> 태그는 전역 속성을 지원하며, 전체 속성 테이블을 확인하십시오. HTML 전역 속성。

이벤트 속성

<optgroup> 태그는 모든 이벤트 속성을 지원합니다. HTML 이벤트 속성。

HTML: <option> 태그 HTML: <ol> 태그