HTML | <optgroup> Tag
This tag is used to create a group of same category options in a drop-down list. The <optgroup> tag is required when there is a long list of the item exists.
Attributes
- label
- Disabled
label: It is used to specify the label for an optgroup.
Example:
<!DOCTYPE html> < html > < head > < title >optgroup tag</ title > < style > body { text-align:center; } .gfg { font-size:40px; font-weight:bold; color:green; } .geeks { font-size:17px; } </ style > </ head > < body > < div class = "gfg" >GeeksforGeeks</ div > < div class = "geeks" >A computer science portal for geeks </ div > < h2 >< optgroup > Tag</ h2 > < select > < optgroup label = "Programming Languages" > < option value = "C" >C</ option > < option value = "C++" >C++</ option > < option value = "Java" >Java</ optgroup > < optgroup label = "Scripting Language" > < option value = "JavaScript" >JavaScript</ option > < option value = "PHP" >PHP</ option > < option value = "Shell" >Shell</ option > </ optgroup > </ select > </ body > </ html > |
Output:
diabled: It is used to disable the option-group in a list.
Example:
<!DOCTYPE html> < html > < head > < title >optgroup tag</ title > < style > body { text-align:center; } .gfg { font-size:40px; font-weight:bold; color:green; } .geeks { font-size:17px; } </ style > </ head > < body > < div class = "gfg" >GeeksforGeeks</ div > < div class = "geeks" >A computer science portal for geeks </ div > < h2 >< optgroup > Tag</ h2 > < select > < optgroup label = "Programming Languages" > < option value = "C" >C</ option > < option value = "C++" >C++</ option > < option value = "Java" >Java</ optgroup > < optgroup label = "Scripting Language" disabled> < option value = "JavaScript" >JavaScript</ option > < option value = "PHP" >PHP</ option > < option value = "Shell" >Shell</ option > </ optgroup > </ select > </ body > </ html > |
Output:
Supported Browser: <optgroup> tag supported by below browsers.
- Google Chrome
- Internet Explorer
- Firefox
- Opera
- Safari