Html Input Types

Type Text

<input type=" text"> It is a single line text input

EX:

  <label for="name1">First name:</label><br>
  <input type="text" id="name2" name="name1"><br>
  <label for="name2">Last name:</label><br>
  <input type="text" id="name2" name="name2">

output :

Type Password

<input type="password"> is a password area.

  <label for="pwd">Password:</label><br>
  <input type="password" id="pwd" name="pwd">

output:

Type Submit

<input type="submit"> defines a button for submitting form data to be further actioned.

  <input type="submit" value="Submit">

output:

Type Reset

<input type="reset"> defines a reset button that will reset all form values to their default values.

<input type="submit" value="Submit">
  <input type="reset">

output:

Type Radio

<input type="radio"> defines a radio button.

  <input type="radio" id="html" name="fav_language" value="HTML">
  <label for="html">HTML</label><br>
  <input type="radio" id="css" name="fav_language" value="CSS">
  <label for="css">CSS</label><br>

output:

Type Checkbox

<input type="checkbox"> defines a checkbox.

  <input type="checkbox" id="vehicle2" name="vehicle2" value="Car">
  <label for="vehicle2"> I have a car</label><br>

output:

Type Button

<input type="button"> defines a button

<input type="button" value="Click Me!">

output:

Type Color

<input type="color"> is used for input fields that should contain a color.

  <label for="favcolor">Select your favorite color:</label>
  <input type="color" id="favcolor" name="favcolor">

output:

Type Date

<input type="date"> is used for input fields that should contain a date

  <label for="birthday">Birthday:</label>
  <input type="date" id="birthday" name="birthday">

output:

Type Email

<input type="email"> is used for input fields that should contain an e-mail address

 <label for="email">Enter your email:</label>
  <input type="email" id="email" name="email">

output:

Type Image

<input type="image"> defines an image as a submit button.

<input type="image" src="kohli.jpg" alt="Submit" width="60" height="60">

output:

Type File

<input type="file"> defines a file-select field and a "Browse" button for file uploads.

  <label for="myfile">Select a file:</label>
  <input type="file" id="myfile" name="myfile">

output:

There are some other input types are also available in HTML...