The <input> tag with a type="date"
attribute creates an input field that accepts a date value.
Inside this field is a calendar icon. Clicking this icon opens a date picker.
An <input> element of type date.
Clicking the calendar icon opens a date picker.
Alternatively, enter a date directly into the field.
<form action="/tutorial/action.html">
<fieldset>
<legend>Date of Birth</legend>
<input type="date" name="dateofbirth"><br /><br />
<input type="submit" value="Submit">
</fieldset>
</form>
The <input type="date">
tag creates an input field for a date (month, day, year).
Clicking the calendar icon inside the field will open a date picker.
The control's UI varies from browser to browser. Not all browsers support date
.
The date field also accepts manual entry which follows a date format.
<input type="date">
Here is when type="date"
support started for each browser:
Chrome
|
20.0 | Jun 2012 |
Firefox
|
57.0 | Nov 2017 |
IE/Edge
|
12.0 | Jul 2015 |
Opera
|
10.1 | Jun 2009 |
Safari
|
Not Supported |
Back to <input>