The input type which can be used to take user input are mentionted below:
| Sr. no | Type= "" | Description |
|---|---|---|
| 1. | text | gives input field to user to enter one line text. |
| 2. | password | gives input field to user to enter one line password. |
| 3. | submit | defines submit button to submit inputs to host. |
| 4. | reset | gives a button which erases all the inputs entered. |
| 5. | radio | gives radio button on which only one option can be selected. |
| 6. | checkbox | gives checkboxes which allows multiple selection of option. |
| 7. | button | gives a button which can be pushed over and handle the event. |
| 8. | file | gives facility to upload a file on form. |
| 9. | image | gives button having image upon. |
| 10. | color | defines a input field with specific color. |
| 11. | date | gives a calendar to upload a date on form. |
| 12. | datetime- local |
gives a calendar to upload a date on form without time zone. |
| 13. | gives input field to upload an email address. | |
| 14. | month | gives input field to control over month. |
| 15. | number | Gives input field to enter especially number. |
| 16. | url | gives input field to enter the url address. |
| 17. | week | gives input field to enter the week. |
| 18. | Search | Defines a single line text field for entering a search string. |
| 19. | Tel | Defines an input field for entering the telephone number. |
| 20. | Range | gives the dragging range button to set the range |
Other than this there is <select> tag which gives the facility to provide the drop down list to the user to select any one item.
<select>
<option name=" " value=" ">item1</option>
<option name=" " value=" ">item2</option>
<option name=" " value=" ">item3</option>
<option name=" " value=" ">item4</option>
</select>
Other than this there is <select> tag which gives the facility to provide the drop down list to the user to select any one item.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>Addmission Form</h1>
<form height="50%" width="40%">
First name:<input type="text" name="fname" placeholder="enter the first name"><br><br>
<!-- here the placeholder is the attribute of the input tag where it specifies the hint to user to enter the input-->
Last name:<input type="text" name="lname" placeholder="enter the last name"><br><br>
Password:<input type="password" name="pass" placeholder="set the password"><br><br>
Confirm Password:<input type="password" name="cp" placeholder="confirm the password"><br><br>
DOB:<input type="date" name="date"><br><br>
Email id:<input type="email" name="email" placeholder="enter your email adddress"><br><br>
Gender:<input type="radio" name="male" value="male">male
<input type="radio" name="male" value="male">Female:<input type="radio" name="male" value="male">other<br><br>
Hobbies:<input type="checkbox" value="Cricket" name="ch1">Cricket
<input type="checkbox" value="dance" name="ch2">dance
<input type="checkbox" value="Sing" name="ch3">Sing
<input type="checkbox" value="read" name="ch4">Read<br><br>
Attach photo here:<input type="file"><br><br>
Qualification<select name="qual">
<option value="10th">10th</option>
<option value="12th">12th</option>
<option value="Graduate">Graduate</option>
<option value="undergraduation">undergraduation</option>
</select><br><br>
Give link of your last year's project:<input type="url"><br><br>
<input type="submit" value="submit" name="submit">
<input type="reset" value="reset" name="reset">
</form>
</body>
</html>
output :-
