tutorialstonight logo
A Platform To Learn To Code

HTML FORM



HTML form are a part of an HTML document which is used to take data as input from the user.

HTML forms have input areas such as text field,password field,radio button,checkbox,submit button, menus etc.

The data received by HTML forms is sent to the server for processing.


HTML form element

HTML form is created by using HTML <form> element.

Example


HTML input types

HTML form gets input using <input> element.

The <input> element is the most important part of HTML form. <input> element has multiple type attribute each define different kind of inputs.Example:<input type="text">

type Description
<input type="text"> type text - defines single line text input
<input type="password"> type password - defines single line text input but it mask the character
<input type="radio"> type radio - defines a radio button(selecting one of many choises)
<input type="checkbox"> type checkbox - defines checkbox(multiple selection from multiple choice)
<input type="email"> type email - defines single line email input space(inclusion of @ is necessary in this box)
<input type="submit"> type submit - defines a submit button for submitting form


HTML text input

<input type="text"> defines a single line text input field.

Example

Run the code

Output:

First Name:

Last Name:


HTML password input

The <input type="text"> defines single line password input box where the password entered by user is masked as * (asterisk) or as .(bullet).

Example

Run the code

Output:

Username:

Password:


HTML radio button input

The <input type="radio"> defines a radio button to choose a single one from multiple options.

Example

Run the code

Output:

Select your gender:
:Male
:Female
:Other

name attribute: - It is used to give name to the HTML form's input so that server may know where the input came from

value attribute: - It is the value that will be used when anything selected.



HTML checkbox input

The <input type="checkbox"> defines a checkbox button to choose one or more from multiple options.

Example

Run the code

Output:

Choose you subjects:
:Maths
:Physics
:Chemistry


HTML email input

The <input type="email"> defines a single line text box where use of @ and a . is necessary.

Example

Run the code

Output:

Enter your email-id and password:
Email:

Password:



HTML submit button

The <input type="submit"> creates a submit button for submitting the form.

Example

Run the code

Output:

Your name:

Your age:



HTML label tag

The <label> tag is optional part of HTML form but it is better to use them. <label> tag doesn't provide anything special to form but it makes convenient for the use; when you click on text written in between label tags it will start toggling it's corresponding input box.

<label> tag can be used in every type of input.

Example

Run the code

Output:






HTML textarea element

The <textarea> element defines multiple line boxes to receive multi-line information. like comments, addresses etc.

The <textarea> element uses the attribute rows and cols to define the size of textarea.

Example

Run the code

Output:

Name:

Address: