HTML <optgroup>标签在 <select>控件的值的下拉列表中创建一组选项。这些下拉值由一系列 <option>标签定义,并使用 <optgroup>标签进行分组。label <optgroup> 的值将显示为 <select>控件中分组项目上方的灰色标题。此标签通常也称为 <optgroup>元素。
通过 <optgroup> 标签把相关的选项组合在一起:
<!doctype html> <html> <head> <meta charset="UTF-8"> <title>HTML optgroup标签的使用(基础教程网 xxs100.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 | 规定禁用该选项组。 | |
text | 为选项组规定描述。 |
<optgroup> 标签支持全局属性,查看完整属性表 HTML全局属性。
<optgroup> 标签支持所有 HTML事件属性。