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 |
|
|
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. |
|
|
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 (0)
No comments yet!