HTML Form Elements List

HTML Form Elements List

The HTML form is an important element of any website. HTML form input have many types which explain information field. Here is the example <input type=”email” name=”email”> it give us a text box where user can write an email.

 

So the list of all input types is here with a description:

Text

It use to take one line input from user

Email

It use to take one line input from user which will be email

Password

It use to take one line input from user which will be password

Submit

It use to send form data into serve

Button

It use to perform a task such as e

Checkbox

It use to make option where user can select multiple option at a time.

File

It is use to select a file from computer, mobile or any other device to upload on live server. Like Images, Videos, Audios, Pdf, Docs and much more.

Radio

It is use to make optional button where user can select one option at a time.

Reset

It is use to reset form input if user add some data in form fields.

Color

It is use to select color options.

Date

It is use to make date selector in form.

Datetime-local

It is use to make a filed where user can add date with out time zone

Month

It is use to make a filed where user can select a month.

Email

It is used to make a where user can only enter an email address.

Number

It is use to make a field where user can add only numbers.

Week

It is use to make field where user can a date with week.

Url

It is use to make a filed where user can add url of any thing like image, pdf link.

Tel

It is use to make a field to enter a telephone umber.

Search

It is use to make a single line text enter where user can search a string.

 

Here we will explain with examples

Input Type Text:

<label for="text">This is a Text Field</label><br>
<input type="text" name="text" id="text">

Input Type Email:

<label for="Email">This is a Email Field</label><br>
<input type="email" name="email" id="email">

Input Type Password:

<label for="password">This is a Password Field</label><br>
<input type="password" name="pass" id="pass">

Input Type Submit:

<label for="submit">This is a Form Submit Button</label><br>
<input type="submit" value="Submit">

Input Type Button:

<label for="button">This is a simple button</label><br>
<input type="button" value="Click Me">

Input Type Checkbox:

<Label>Select Multiple Languages</Label>
<input type="checkbox" name="" value="HTML">HTML<br>
<input type="checkbox" name="" value="CSS">CSS<br>
<input type="checkbox" name="" value="JAVASCRIPT">JAVASCRIPT<br>
<input type="checkbox" name="" value="JAVA">JAVA<br>

Input Type Radio:

<Label>Select Your Favourite Subject</Label>
<input type="radio" name="" id="" value="English">English<br>
<input type="radio" name="" id="" value="Urdu">Urdu<br>
<input type="radio" name="" id="" value="Math">Math<br>

Input Type Reset:

<input type="reset" value="Reset Form">

Input Type Color:

<input type="color" name="color" id="color">

Input Type date:

<input type="date" name="date" id="date">

Input Type Datetime-local:

<input type="datetime-local" name="date" id="date">

Input Type Month:

<input type="month" name="month" id="month">

Input Type Number:

<input type="number" name="phone" id="phone">

Input Type Week:

<input type="week" name="week" id="week">

Input Type Url:

<input type="url" name="url" id="url">

Input Type Tel:

<input type="tel" name="tel" id="tel">

Input Type Search:

<input type="search" name="search" id="search">

 

Comments

No Comment posted Yet!

Leave a Reply

OK! You can skip this field.