Drop-down lists in forms on your website are a great way to give users lots of options in a small amount of screen space. You use two HTML tags to create a drop-down list:
element to name your list.
A collection of elements identifies individual list options.
The value attribute assigns a unique value for each element.
Here’s a markup example for a drop-down list:
<form action="bin/guestbook.php" method="post">
<p>What is your favorite food?</p>
<select name="food">
<option value="pizza">Pizza</option>
<option value="icecream">Ice Cream</option>
<option value="eggsham">Green Eggs and Ham</option>
</select>
</form>
The browser turns this markup into a drop-down list with three items, as shown in the figure.
You can also enable users to select more than one item from a drop-down list by changing the default settings of your list:
If you want your users to be able to choose more than one option (by holding down the Ctrl [Windows] or Command [Mac] key while clicking options in the list), add the multiple attribute to the tag to specify how many options to show.
If you specify fewer than the total number of options, the browser includes a scroll bar with the drop-down list.
You can specify that one of the options in the drop-down list be already selected when the browser loads the page, just as you can specify a check box or radio button to be selected. Simply add the selected attribute for the tag you want as the default. Use this when one choice is very likely, knowing that users can override your default selection quickly and easily.