select form control is a container for a series of
option elements that display in the
browser as a pull-down menu (that is, a drop-down list). Unless you use
multiple attribute, the
control will allow the user to pick just one item from the list of options
that’s generated by the contents of the nested
select renders slightly differently
depending on the browser and operating system in use, and is well known as
a troublesome HTML element to style with CSS (because the display is
inherited from the operating system, rather than provided by the browser).
If there isn’t enough room on the page for the list to display below the
control, it will open up above it. Figure 1 shows an expanded (opened)
select list in Firefox.
This example shows a
<form> <label for="favoritefood">Favorite food</label> <select name="favoritefood" id="favoritefood"> <option>Cheese</option> <option>Egg</option> <option>Cabbage</option> ⋮ </select> </form>
Use This For …
This element is
used to allow visitors to make selections from a long list of items. The
alternative approach would involve the use of radio
input selections, but this would require all the
options to be displayed on the page at once;
controls generally display in a smaller amount of page real
It causes no compatibility issues, and has excellent support across all tested browsers.
In this Section
- Sat, 17 May 2008 14:24:06 GMT
It should be noted, that if the <code>size</code> property is set, the widget is rendered different, than when it is not set.