HTML Input Types

1.Input Type Password (<input type="password" >) :-

Basically, this input types mainly use in Login form , Dashboard etc.

Ex. <form action="abcd.php">

<label for="pwd">Password:</label><br>

<input type="password" id="pwd" name="pwd">

</form>

Output: Touch Me for Output(reference by W3school)

2.Input Type Reset (<input type="Reset">):-

Here, using highly in google form or any other form etc.

Ex. <form action="acbd.php">

<label for="fname">First name:</label><br>

<input type="text" id="fname" name="fname" value="John"><br>

<label for="lname">Last name:</label><br>

<input type="text" id="lname" name="lname" value="Doe"><br><br>

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

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

</form>

Output: Touch Me for Output (reference by W3school)

3.Input Type Color (<input type="color" >):-

Basically, Also using for color picker which are using webpage etc.

Ex. <form action="abcd.php">

<label for="favcolor">Select your favorite color:</label>

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

</form>

Output: Touch Me for Output (reference by W3school)

4.Input Type Datetime-local(<input type="datetime-local" >):-

When, both date and time are showing in webpage etc.

Ex. <form action="abcd.php">

<label for="birthdaytime">Birthday (date and time):</label>

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

</form>

Output: Touch Me for Output (reference by W3school)

5.Input Type File(<input type="file" >):-

Mainly using for upload file in webpage etc.

Ex. <form action="abcd.php"> <label for="myfile">Select a file:</label> <input type="file" id="myfile" name="myfile"> </form>

Output: Touch Me for Output (reference by W3school)

6.Input Type Range(<input type="range" >):-

Here, using for slider or skills representation in this form.

Ex. <form action="abcd.php">
<label for="vol">Volume (between 0 and 50):</label>
<input type="range" id="vol" name="vol" min="0" max="50">
</form>

Output: Touch Me for Output (reference by W3school)