HTML Input Types
The type attribute changes what an <input> does and how it is shown.
The type controls the on-screen control, the keyboard shown on phones, and the basic checks the browser applies before the form is submitted.
A Few Useful Types
Email and Password
Two typed fields
<!DOCTYPE html>
<html>
<body>
<label for="email">Email:</label>
<input type="email" id="email" name="email">
<label for="password">Password:</label>
<input type="password" id="password" name="password">
</body>
</html>A Number With Limits
number with min and max
<!DOCTYPE html>
<html>
<body>
<label for="qty">Quantity:</label>
<input type="number" id="qty" name="qty" min="1" max="10">
</body>
</html>Note: Choosing the right type improves both validation and the on-screen keyboard, especially on mobile.
Exercise: HTML Input Types
Which input type shows a built-in date picker in most modern browsers?