Html

1. HTML Form Elements Help sheet
Mrs Krishnamoorthy Northfleet School for Girls | 1P a g e
This help sheet will guide you through how to create different types of Form fields.
Remember to include the form tags <form> and </form>
input type indicates the type of form field to be created.
Creating a Textbox:
Syntax:
<input type="text" name="Surname">
Surname:
Creating a Textarea (Multiple lines textbox)
Syntax:
Comments: <textarea rows="5" cols="30"> cols stands for columns
</textarea> You must close the text area otherwise any HTML code you type after
textarea will be displayed inside the text area.
Comments:
Creating Radio Buttons
When you want your users to pick one item from the list, the radio button must be
used.
Syntax:
<input type="radio" name="eyecolor1" value="Brown" /> Brown<br />
<input type="radio" name="eyecolor2" value="Grey” /> Grey<br />
<input type="radio" name="eyecolor3" value="Blue" /> Blue<br />
<input type="radio" name="eyecolor4" value="Green" /> Green<br />
Brown
Grey
Blue
Green

2. HTML Form Elements Help sheet
Mrs Krishnamoorthy Northfleet School for Girls | 2P a g e
Creating Check box fields
When you want your users to pick one or more items from a short list, then
checkboxes are ideal.
Syntax:
<input type="checkbox" name="fruit" value="apples" /> Apples<br />
<input type="checkbox" name="fruit" value="strawberries" /> Strawberries<br />
<input type="checkbox" name="fruit" value="blueberries" /> Blueberries<br />
<input type="checkbox" name="fruit" value="peaches" /> Peaches<br />
Apples
Strawberries
Blueberries
Peaches
Creating dropdown box/Combo box
Syntax:
Select your favourite Ice-cream:
<select name="Icecream">
<option value="Vanilla">Vanilla</option>
<option value="Chocolate">Chocolate</option>
<option value="Strawberry">Strawberry</option>
</select>
Every option must be closed</option> to avoid displaying all options in the same
row.
Select your favourite Ice-cream:
Vanilla
Creating submit button:
Syntax:
<input type="submit" value="Submit Form" name="submit">
Submit Form
Now it is your turn to create a form to order pizza online.