![]() |
VOOZH | about |
The HTML <optgroup> tag is used to group related <option> elements within a dropdown list. This is especially useful for long lists of options, making it easier for users to navigate. The <optgroup> tag has a single required attribute, label, which specifies a label or heading for the group of options.
<optgroup label="Group Name">
<option value="value1">Option 1</option>
<option value="value2">Option 2</option>
...
</optgroup>
The <optgroup> tag supports a few key attributes that provide additional functionality.
Attribute Values | Description |
|---|---|
It is used to specify the label for an optgroup. | |
It is used to disable the option-group in a list. |
The <optgroup> tag supports both Global Attributes and Event Attributes in HTML.
Global attributes like id, class, disabled, and style help you modify the appearance and behavior of <optgroup>.
Event attributes like onclick, onfocus, and onmouseover add interactivity to the <optgroup>, although they're more commonly used with <option> or <select>.
Example 1: In this example, we will implement the optgroup tag in an HTML document.
Output:
Example 2: In this example, we will implement the <optgroup> tag with the disabled property in an HTML document.
Output: