HTML <optgroup> Tag

If this site has been useful, we’d love your support! Running this site takes time and resources, and every small contribution helps us keep creating valuable content. Consider buying us a coffee to keep things going strong!

Description

The <optgroup> HTML element is a container inside which the <option> elements are combined into one group. The peculiarity of <optgroup> is that it does not stand out as a regular list item, it is accented with a bold style, and all elements included in this container are shifted to the right of its original position.

Properties

Permitted Parents
A <select> element
Content
One or more <option> elements
Start/End Tags
Start tag: required, End tag: required

Example

<select>
<optgroup label="Fruits">
<option value="banana">Banana</option>
<option value="orange">Orange</option>
<option value="apple">Apple</option>
</optgroup>
<optgroup label="Vegetables">
<option value="carrot">Carrot</option>
<option value="tomato">Tomato</option>
<option value="onion">Onion</option>
</optgroup>
</select>

Attributes

Attribute Definition
label Specifies a label for the option group.
disabled Disables the input control. The button won't accept changes from the user. It also cannot receive focus and will be skipped when tabbing.

Global Attributes

The <optgroup> tag also supports the Global Attributes in HTML5

Event Attributes

The <optgroup> tag also supports the Event Attributes in HTML5

Browser Support

The following table will show you the current browser support for the HTML <optgroup> tag.

Desktop
Edge Chrome Firefox Opera Safari
1211154
Tablets / Mobile
Chrome Firefox Opera Safari Samsung Webview
184143.214.4

Last updated by CSSPortal on: 30th March 2024