HTML and CSS Reference
In-Depth Information
Table 3-3. Browser support for the date and time input types
IE
Firefox
Chrome
Safari
Opera
iOS
Android
-
-
10+
5.0+
9.0+ ✓✓
For tips on delivering a more consistent cross-browser experience, see
Recipe 3.13
.
Like all other form inputs, you can specify a value to be displayed when the page is
rendered. The value for the
date
input type must be a valid date string, such as
2010-12-31
, which represents December 31, 2010.
The value for the
time
input type must be a valid time string, such as
23:59:59
, which
represents 11:59 P.M., one second before midnight.
Finally, the value for the
datetime
input type must be a valid global date and time string,
such as
2010-12-31T23:59:59Z
, which represents one second before midnight UTC on
December 31, 2010.
Additional features
Two new
input
element attributes,
min
and
max
, can limit the range of dates and
times that users can select. This is useful in cases where you don't want users to
select appointment dates or times in the past or select birthdates in the future, as shown
in
Figure 3-11
:
<form>
<fieldset>
<legend>Appointment Request</legend>
<p><label>Date <input type="date" name="date"
min="2011-03-15"
max="2012-03-14"
></label></p>
<p><label>Time <input type="time" name="time"
min="08:00"
max="18:00"
></label></p>
</fieldset>
<p><button type="submit">Submit</button></p>
</form>
See Also
For more information on valid date and time values, see the HTML5 specification at
