9.7 Select

Another form of limited choice selection that can be used in forms are drop boxes. This requires two more tags:

TagPurpose
<select>This defines the choice list itself
<option>This defines the available choice in the list.

For example we could have:

<form>
<select name="browsers">
<option value="Internet Explorer">Internet Explorer</option>
<option value="Mozilla Firefox">Mozilla Firefox</option>
<option value="Apple Safari">Apple Safari</option>
<option value="Opera">Opera</option>
</select>
</form>

This would provide a drop-down box type of choice, with the first item in the lists visible only, and would look like this in a browser (try clicking on the down arrow):

Using a pre-selected Value

This is just like above, but if we wish to change what is shown initially in the selection from something other than the first item in the list, we can add the selected attribute to one of the options. For example:

<form>
<select name="browsers">
<option value="Internet Explorer">Internet Explorer</option>
<option value="Mozilla Firefox" selected="selected">Mozilla
Firefox</option>
<option value="Apple Safari">Apple Safari</option>
<option value="Opera">Opera</option>
</select>
</form>

This would look like this in a browser (now shows the second item in the list initially):