With this element you can group several options in a selection list, created with the SELECT element, together. This element is only valid inside the element.

Inside this element you put the options that belong to the option group. These options are created with the OPTION element.

A browser could show this selection list like a cascading menu with the option group as the first level and the options inside the group as the second level. At this moment nested option groups aren't allowed.

<!ELEMENT OPTGROUP - - (OPTION)+ -- option group -->
<!ATTLIST OPTGROUP
  %attrs;                              -- %coreattrs, %i18n, %events --
  disabled    (disabled)     #IMPLIED  -- unavailable in this context --
  label       %Text;         #REQUIRED -- for use in hierarchical menus --
  >

Core attributes: class id style title
Internationalization attributes: dir lang
Events: onclick ondblclick onmousedown onmouseup onmouseover onmousemove onmouseout onkeypress onkeydown onkeyup

Select your favorite food : <FORM> <SELECT> <OPTGROUP label="Fruit"> <OPTION>Apple <OPTION>Cherry <OPTION>Banana <OPTION>Pineapple </OPTGROUP> <OPTGROUP label="Fastfood"> <OPTION>Hamburger <OPTION>Pizza </OPTGROUP> <OPTGROUP label="Nuts"> <OPTION>Peanuts <OPTION>Coconuts </OPTGROUP> </SELECT> </FORM>

Select your favorite food : Apple Cherry Banana Pineapple Hamburger Pizza Peanuts Coconuts