HTML5 input types
HTML5 has a number of extra input types. These have been a great addition because when they are supported, they offer great additional functionality and, when not supported, they still behave like a standard text type input. Let’s take a look at them.
The email input type
You can set an input to the type of email like this:
type="email"
Supporting browsers will expect a user input that matches the syntax of an email address. In the following code example, type="email" is used alongside required and placeholder:
<div>
<label for="email">Your Email address</label>
<input
type="email"
id="email"
name="email"
placeholder="[email protected]"
required
/>
</div>
When used in conjunction with required, trying to input a non-conforming value will generate a warning message:
Figure 13.6: An error shows...