HTML Tutorial

Chapter 14: Forms Continued

Pull Down & Scrolling Lists

The next type of input is a Pull Down List. With this type you use <SELECT> instead of <INPUT> and it has a closing tag. We then add a name, as with all forms, and give our select some options using the <option></option> tags.

<select name="select">
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
</select>

Now we can give each <option> a value.

<select name="select">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
</select>

A Scrolling List is very similar in construction to a Pull Down List. We'll add a few more options first. Then, all we do to turn it into a Scrolling List is add a size attribute to the <select> tag.

<select name="select" size="4">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4">Option 4</option>
<option value="5">Option 5</option>
<option value="6">Option 6</option>
</select>

The size is simply how many options show in the window.

Text Area

A very useful type of input is <textarea>. You control the size of the text area by adding the rows="" and cols="".

<textarea name="textarea" rows="5" cols="3"></textarea>