| Name | Syntax | Interactive Example | Description | Closing Tag |
|---|---|---|---|---|
| Form | <form> | - | Containing element for generated form |
Yes
</form> |
| Label | <label> | - | Provides identification for specific <input>s based on their id attribue paired with a matching for attribute within the opening <label> element |
Yes
</label> |
| Checkbox | <input type="checkbox"> | Renders a clickable checkbox | No | |
| Radio Button | <input type="radio"> | Multiple radio buttons that share the same name attribute will render a selection of radio buttons of which only a single option can be selected | No | |
| Range | <input type="range"> | Renders a slider based on specified range of values provided | No | |
| Text | <input type="text"> | Renders a space for user to input text | No | |
| Password | <input type="password"> | Renders a space for users to input values that are automatically sensored | No | |
| Number | <input type="number"> | Renders space for user to input number only
Note: up/down selector is automatically generated when user interacts with element |
No | |
| Data List |
<datalist>
<option> </datalist> |
Renders a drop-down list populated with <option>s
Note: user can input text and numbers manually as well as choosing an <option> |
Yes
<datalist> |
|
| Select |
<select>
<option></option> </select> |
Renders a drop down menu populated with value(s) specified between the <option> elements |
Yes
</select> |
|
| Text Area | <textarea> | Renders area for user to input free-text |
Yes
</textarea> |
|
| Submit | <input type="submit"> | Renders a clickable "Submit" button that executes the action of the <form> as per the action and method attributes within the opening tag | No |
Reference: CodeCademy Lean HTML Forms Cheatsheet
Please note the above table contains heavily simplified information
Please study reference material for further instruction