HTML Forms Reference


Tags Element Attribute Name Description
<form></form> Form Allows users to input information and sends it to an external source.
action="[destination file]" Action Determines where the form's information goes.
method="POST"
method="GET"
Method "POST" is used to send data to a server to create/update a resource, whereas "GET" is used to request data from a specified resource.
<input></input> Input Adds fields for users to input information.
name="name" Name Assigns a name to an <input> element.
value="value" Value This attribute is used with an <input> element for users to have a pre-filled text field when they first see the rendered form.
type="text" Type: text Creates a single row field for text input.
type="password" Type: password Creates a single row field that censors text input.
type="number" Type: number Creates a single row field for number input.
type="range" Type: range Creates a slider to select from a range of numbers.
type="checkbox" Type: checkbox Creates a single checkbox which can be paired with other checkboxes.
type="radio" Type: radio Creates a radio button that can be paired with other radio buttons.
type="list" Type: list Will pair the <input> with <datalist> if the id of both are the same.
type="submit" Type: submit Creates a submit button
<select></select> Select It is populated with <option> elements and works with an <input> to search through choices.
name="name" Name Assigns a name. Without the name the form won't work.
id="id" ID Gives unique ID.
<option></option> Option The <select> or <datalist> can have many <option>s, which either render a dropdown list for selection (in <select> element), or searches through choices (for <datalist> element).
value="value" Value Assigns value to the <option>.
<datalist></datalist> Datalist It is populated with <option> elements and works with an <input> to search through choices.
<textarea><textarea> Textarea A text input field that has a customizable area.
<label></label> Label Displays text that is written between the opening and closing tags.
for="[<input>'s id]" For Assigns the <for> of the <label> element with the value of the id attribut of <input>.

Created as a project in the Full-Stack Engeneer path at Codecademy by Oksana, 2021