Property selector for option

  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
     <head>
        <style type="text/css">
            option[value] {
                letter-spacing: 2px;    
            }
            option[value='newspaper'] {
                background: orange;    
            }
            option[value='magazine'] {
                background: red;
            }
            option[value='television'] {
                background: black;
            }
            option[value='radio'] {
                background: green;
            }
            option[value='other'] {
                background: blue;
            }
            input[name$='[name]'] {
                color: darkred;
            }
            input[name$='[email]'] {
                color: darkblue;
            }
            textarea[name$='[address]'] {
                color: purple;
            }
            textarea[name$='[message]'] {
                color: black;
            }
            select[name$='[heard]'] {
                color: darkgreen;
            }
            input[name^='feedback'], select[name^='feedback'], textarea[name^='feedback'] {
                font-weight: bold;
            }

        </style>
        <title>Feedback Form - Widgets and What's-its</title>
    </head>
    <body>
        <form>
            <div>
                <label for='feedback[heard]'>How'd you hear about us?</label>           
                <select name='feedback[heard]'>
                    <option value=''>Choose...</option>
                    <option value='newspaper'>Newspaper</option>
                    <option value='magazine'>Magazine</option>
                    <option value='television'>Television</option>
                    <option value='radio'>Radio</option>
                    <option value='other'>Other</option>
                </select>
            </div>
        </form>
    </body>
</html>

1.	select tag presents a drop-down list with choices indicated by the option tags
2.	select tag
3.	multiple select
4.	Style for select option
5.	Set form select font size
6.	Set form select option font size
7.	Set form select event option color and background color
8.	option tag
9.	Option groups
10.	Select control Jump Menu
11.	fieldset to wrap 'select' control
12.	Drop down select boxes
13.	Scolling select boxes
14.	Select boxes with the multiple attribute
15.	Select boxes with the optgroup element
16.	Creating groups of options with a disabled option
17.	input:focus, textarea:focus, select:focus
18.	optgroup
19.	select font-size: 0.9em;
20.	select element
21.	A multiline select
22.	Pulldown Example

Property selector for option : select « Form « HTML / CSS

Related examples in the same category