maxdesign.com.au

Published:

Can you list all of the 22 different input types without having to resort to using Google? Here you go:

1. <input type="button">

<input type="button" value="Button">

2. <input type="checkbox">

<input id="checkbox" type="checkbox">
<label for="checkbox">Subscribe</label>

3. <input type="color">

<label for="color">Pick a colour</label>
<input id="color" type="color">

4. <input type="date">

<label for="date">Choose a date</label>
<input id="date" type="date">

5. <input type="datetime-local">

<label for="datetime">Choose a date and time</label>
<input id="datetime" type="datetime-local">

6. <input type="email">

<label for="email">Email address</label>
<input id="email" type="email">

7. <input type="file">

<label for="file">Choose a file</label>
<input id="file" type="file">

8. <input type="hidden">

<input type="hidden">

9. <input type="image">

<input type="image" alt="Login" src="a.png">

10. <input type="month">

<label for="month">Choose a month</label>
<input id="month" type="month">

11. <input type="number">

<label for="number">Choose a number</label>
<input id="number" type="number">

12. <input type="password">

<label for="password">Password</label>
<input id="password" type="password">

13. <input type="radio">

<input id="radio" type="radio">
<label for="radio">Yes</label>

14. <input type="range">

<label for="range">Choose a range</label>
<input id="range" type="range">

15. <input type="reset">

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

16. <input type="search">

<label for="search">Search the site</label>
<input id="search" type="search">

17. <input type="submit">

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

18. <input type="tel">

<label for="tel">Phone number</label>
<input id="tel" type="tel">

19. <input type="text">

<label for="text">Name</label>
<input id="text" type="text">

20. <input type="time">

<label for="time">Choose a time</label>
<input id="time" type="time">

21. <input type="url">

<label for="url">Web address</label>
<input id="url" type="url">

22. <input type="week">

<label for="week">Choose a week</label>
<input id="week" type="week">