0Pricing
HTML Academy · Lesson

Select and option Dropdown Menus

Create dropdown selection menus with select and option.

The select Element

The <select> element creates a dropdown menu:

<label for="country">Country</label>
<select id="country" name="country">
  <option value="us">United States</option>
  <option value="gb">United Kingdom</option>
  <option value="de">Germany</option>
</select>

option value vs text

Each <option> has a value (sent to server) and display text:

<select name="color">
  <option value="">-- Select a color --</option>  <!-- placeholder -->
  <option value="#ff0000">Red</option>
  <option value="#00ff00">Green</option>
  <option value="#0000ff">Blue</option>
</select>
<!-- value="#ff0000" is submitted; "Red" is displayed -->

All lessons in this course

  1. Select and option Dropdown Menus
  2. Textarea for Multi-line Input
  3. Checkbox and Radio Button Groups
  4. Datalist for Autocomplete
← Back to HTML Academy