Working with Forms

HTML forms allow us to collect information or receive input from our site visitors. In this module we will explore the basic elements of an HTML form.

• <form> – open and closes a web based form (block-level element) includes the action and method attributes.
• <fieldset> opens and closes a group of related form input options. A single form may have multiple fieldsets
• <legend> declares a heading for a fieldset grouping
• <label> – The name of the input that is displayed on the screen, required for accessible forms
• <input> – element that the user uses to input data. Must contain the type and name attributes. This is a self-closing tag. Below is a list of a few of the different input types
  • text – displays a single line input
  • submit – displays a button that the user can click to submit the form
  • reset – resets the values in the form elements to their default values
• <textarea> – displays a multi-line input – not self closing
• <select> – displays a dropdown list of options for the user to select

Example Form

Personal Information

Name

Address

Gender
MaleFemale

Form Code

[crayon]

Personal Information

Name

Address
<br />

Gender
MaleFemale

[/crayon]