HTML and CSS Reference
While you might not find yourself using this input very often, when you need it, it's
certainly invaluable to have. And at the end of the day, how cool is it to be able add
some color to a form, literally, when so often forms are a sea of bland text input fields?
Date and time input
Date/time controls are a common requirement for websites that need to gather input for
a specific date and time, such as airline booking sites or hotel accommodation book-
ing systems. To address this need, HTML5 has added quite a few inputs related to
selecting particular date and time values and ranges. The date , time , datetime ,
datetime-local , month , and week input types create finer- or coarser-grained
methods of gathering time and date information. These form controls typically feature a
numerical stepper and/or what looks like a standard drop-down list ( Figure 4-10 ). The
most sophisticated implementation at the moment, in Opera, produces a pop-up calendar
control when clicked for selecting the desired date ( Figure 4-11 ).
1 URL-encoded means special characters are converted to a code that is safe to transmit via a web-
site URL address.
2 As mentioned in an earlier example, we'll get to the label element later.
Figure 4-10. All the different date- and time-related inputs as shown in the Opera web browser.
From top to bottom: date , time , datetime , datetime-local , month , week .