HTML Old School

To create dropdown menu with selectable items use <select></select> HTML tag.

<form action="" method="POST" enctype="application/x-www-form-urlencoded">
  city: <select name="town">
            <option value="Našice">Našice</option>
            <option value="Valpovo">Valpovo</option>
            <option value="Osijek" selected>Osijek</option>
            <option value="Đakovo">Đakovo</option>
     </select>
</form>

 Example: 14select.html

 Notice that you must put <option> tag inside select tag.

 

 

SELECT tag attributes

1. name="string"

Defines variable name.

 

2. size="int"

Defines how many items will be visible, e.g the height of the select box.

Example with size="3" : 15select_size.html

 

3. multiple

Enables selecting of multiple option items. Don't use size in combination with it.

Example: 16select_multiple.html

 

 

 OPTION tag attributes

 1. value="string"

 Define variable value.

 

2. selected

Default selected value. Only one option tag can have this attribute.

Example with selected attribute: 14select.html

 

 

OPTGROUP tag

Enables grouping of options.

    <select name="car">

        <optgroup label="Swed">
            <option>SAAB</option>
            <option>Volvo</option>
        </optgroup>

        <optgroup label="Germ">
            <option>Mercedes</option>
            <option>Audi</option>
        </optgroup>

    </select>

Example: 17select_optgroup.html

 

 

CSS styling

Use style="width:210px;height:30px;font:15px Verdana;" for basic modifications.

Example: 18select_css_styling.html