HTML and CSS Reference
In-Depth Information
In your bookings form, you used the
number
type for the Number of Guests field.
<input
type="number"
name="guests" id="guests" value="2">
URLs
The input type
url
is also new in HTML5 and enables you to specify that you are expecting a web address as the in-
put. Again, devices with software keyboards may present a customized keyboard to users. Figure 6-5 shows the key-
board presented in iOS. This time, the space bar has been replaced with the special characters commonly used in
URLs.
Figure 6-5
The iOS keyboard displayed for input elements with the type url.
Browsers that support form validation will also validate the contents of
url
inputs when the form is submitted. This
is to check that the format of the URL supplied by the user is valid.
Here is a short snippet that shows how to create an
<input>
element with the type
url
.
<input
type="url"
name="website" id="website">
Search
The
search
type is much the same as the
text
input type, with the only real difference being how the field is dis-
played in the browser. Input elements with the
search
type will inherit the operating system's natural styling for
search fields. This helps users to quickly recognize search forms on your web pages because the search forms are
styled in a way that users recognize. Figure 6-6 shows how the following
search
input would be displayed in
Google Chrome on Mac OS X.
<input
type="search"
name="term" id="term">
