HTML Select Tag

The select tag creates a drop down list and can also create a list box.


<option value="value">text</option>

The option tag creates each drop down list item. The value attribute gives each item a value.

Sponsored Links


<select name="age" id="age">
     <option value="16">16</option>
     <option value="17">17</option>
     <option value="18">18</option>
     <option value="19">19</option>
     <option value="20">20+</option>


List Box

With the select tag you can also create a list box; the syntax is as follows:

<select name="name" size="number of items to show" multiple="multiple">
<option value="value">text</option>

It is not necessary to have multiple attribute, however if you do include it then users can select multiple values by holding down the CTRL key.


<select name="food" size="3" >
    <option value="pizza">pizza</option>
    <option value="pasta">pasta</option>
    <option value="chips">chips</option>


The width of the list box will automatically adjust to the longest option.

Grouping Items

You can also group items using the <optgroup> tag.


<optgroup label="group name">


<select name="games" size="8" >
<optgroup label="Action & Adventure">
    <option value="MW3">Modern Warefare 3</option>
    <option value="BF3">Battlefield 3</option>
    <option value="GTA4">Gran Theft Auto 4</option>

<optgroup label="Racing">
    <option value="GRID">Race Driver Grid</option>
    <option value="NFS">Need For Speed</option>
    <option value="GT">Gran Turismo</option>


Try It!

(You can select multiple options for the list box.)