<optgroup label="Swedish Cars"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> </optgroup> <optgroup label="German Cars"> <option value="mercedes">Mercedes</option> <option value="audi">Audi</option> </optgroup> </select>

Pro Tip: When you use multiple attribute, user can press Ctrl + Click (or Cmd + Click on Mac) to select many items at same time!

Rendered Output Preview:

Optgroup & Multiple Selection (Ctrl+Click):

3. Select Properties and Attributes in HTML

We can put many properties on <select> tag and <option> tag to make dropdown list more useful for user:

name : Name of dropdown box when send data to server.
id : Unique ID for target with CSS or JavaScript.
multiple : Allow user for select more than one item.
size : Show number of visible items box without click dropdown.
disabled : Lock dropdown box so user cannot click or change.
autofocus : Auto focus on dropdown box when web page load finish.
required : User must select one option before submit form.
selected : Put on <option> tag for make default selected item.

Example with Attributes

<select name="car_brand" id="cars" required autofocus>
  <option value="" di

#optgroup

Everything about Dropdown List in HTML with Video Examples