The <time> tag is used to specify the time and date in html page. We declare time and date inside the <time> tag using attribute “datetime” for the machine readable. The user readable time is written between the start and end tag of the <time> tag.
As put by the HTML5 specifications:
The time tag represents either a time on a 24 hour clock, or a precise date in the proleptic Gregorian calendar, optionally with a time and a time-zone offset. [GREGORIAN]
This tag is intended as a way to encode modern dates and times in a machine-readable way so that, for example, user agents can offer to add birthday reminders or scheduled events to the user’s calendar. ( W3C )
<time> tag is a machine-readable format, so any script or search engine reading your content can understand the date/time of publication. That way you can format it in a nice way for readers without affecting machine readability. It’s covered under microformats which are a good thing.
The Syntax of <time> Tag
<time attributes> body content </time>
Attributes of <time> Tag
- datetime: It is used to specify the date and time within the time tag.
Browser Support
The <time> tag does not render as anything special in any of the major browsers.
HTML5 Time Tag Example
<!DOCTYPE html>
<html>
<head>
<title>time tag</title>
</head>
<body>
<p>We have meeting at <time>12:00</time> today.</p>
<p>There is a birthday party <time datetime="2014-02-23 18:00 ">
on Sunday at my friend's home.</time>.
</p>
</body>
</html>
Here we are dispalying the date and time using the <time> tag.
Steps for Execution
- Save this file as time_example.html in your eclipse IDE.
- Now select this html file, right mouse click and select Run as ->Run on server
Output
When the execution process is completed successfully we will get the following output :
HTML5 Progress Tag