Please note, this is a STATIC archive of website developer.mozilla.org from 03 Nov 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

Revision 641537 of <time>

  • Revision slug: Web/HTML/Element/time
  • Revision title: <time>
  • Revision id: 641537
  • Created:
  • Creator: sjakthol
  • Is current revision? No
  • Comment

Revision Content

The HTML <time> element represents either a time on a 24-hour clock or a precise date in the Gregorian calendar (with optional time and timezone information).

This element is intended to be used presenting dates and times in a machine readable format. This can be helpful for user agents to offer any event scheduling for user's calendar. 

Usage note: This element is not appropriate for instances where a specific date cannot be calculated, nor should it be used for dates prior to the introduction to the Gregorian calendar (due to complications with calculating those dates).

Attributes

Like all other HTML elements, this element supports the global attributes.

{{htmlattrdef("datetime")}}
This attribute indicates the time and date of the element and must be a valid date with an optional time string. If the value cannot be parsed as a date with an optional time string, the element does not have an associated time stamp.

Examples

Simple example

<p>The concert starts at <time>20:00</time>.</p>

Above HTML will output:

The concert starts at 20:00.

datetime example

<p>The concert took place on <time datetime="2001-05-15 19:00">May 15</time>.</p>

Above HTML will output:

The concert took place on May 15.

Specifications

Specification Status Comment
{{SpecName('HTML WHATWG', '#the-time-element', '<time>')}} {{Spec2('HTML WHATWG')}} No change from {{SpecName('HTML5.1')}}
{{SpecName('HTML5.1', 'grouping-content.html#the-time-element', '<time>')}} {{Spec2('HTML5.1')}} No change from {{SpecName('HTML5 W3C')}}
{{SpecName('HTML5 W3C', 'grouping-content.html#the-time-element', '<time>')}} {{Spec2('HTML5 W3C')}} Initial definition.

Browser compatibility

{{CompatibilityTable}}

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 33.0 {{CompatGeckoDesktop("22.0")}} 9.0 22.0 7.0
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 2.1 {{CompatUnknown}} {{CompatGeckoMobile("22.0")}} 10.0 11.50
Removed in 15.0
4.0-4.1

See also

  • The {{HTMLElement("data")}} element, allowing to signal other kind of values.

{{HTMLRef}}

Revision Source

<p>The <strong>HTML <code>&lt;time&gt;</code> element</strong> represents either a time on a 24-hour clock or a precise date in the <a class="external" href="https://en.wikipedia.org/wiki/Gregorian_calendar" title="https://en.wikipedia.org/wiki/Gregorian_calendar">Gregorian calendar</a> (with optional time and timezone information).</p>
<p>This element is intended to be used presenting dates and times in a machine readable format. This can be helpful for user agents to offer any event scheduling for user's calendar.&nbsp;</p>
<div class="note">
 <strong>Usage note: </strong>This element is not appropriate for instances where a specific date cannot be calculated, nor should it be used for dates prior to the introduction to the Gregorian calendar (due to complications with calculating those dates).</div>
<ul class="htmlelt">
 <li><dfn><a href="/en-US/docs/Web/HTML/Content_categories" title="HTML/Content_categories">Content categories</a></dfn><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content" title="HTML/Content_categories#Flow_content">Flow content</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">phrasing content</a>, palpable content.</li>
 <li><dfn>Permitted content</dfn> <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">Phrasing content</a>, but no descendant <code>time</code> elements.</li>
 <li><dfn>Tag omission</dfn> None; both the starting and ending tags are mandatory.</li>
 <li><dfn>Permitted parent elements</dfn> Any element that accepts <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">phrasing content</a>.</li>
 <li><dfn>DOM interface</dfn> {{domxref("HTMLTimeElement")}}</li>
</ul>
<h2 id="Attributes">Attributes</h2>
<p>Like all other HTML&nbsp;elements, this element supports the <a href="/en-US/docs/HTML/Global_attributes" title="HTML/Global attributes">global attributes</a>.</p>
<dl>
 <dt>
  {{htmlattrdef("datetime")}}</dt>
 <dd>
  This attribute indicates the time and date of the element and must be a <a class="external" href="https://www.w3.org/TR/html-markup/datatypes.html#common.data.datetime" title="https://www.w3.org/TR/html5/common-microsyntaxes.html#valid-date-string-with-optional-time">valid date with an optional time string</a>. If the value cannot be parsed as a date with an optional time string, the element does not have an associated time stamp.</dd>
</dl>
<h2 id="Examples">Examples</h2>
<h3 id="Simple_example" name="Simple_example">Simple example</h3>
<pre class="brush: html">
&lt;p&gt;The concert starts at &lt;time&gt;20:00&lt;/time&gt;.&lt;/p&gt;
</pre>
<p>Above HTML will output:</p>
<p>The concert starts at 20:00.</p>
<h3 id="Datetime_example" name="Datetime_example"><code>datetime</code> example</h3>
<pre class="brush: html">
&lt;p&gt;The concert took place on &lt;time datetime="2001-05-15 19:00"&gt;May 15&lt;/time&gt;.&lt;/p&gt;
</pre>
<p>Above HTML will output:</p>
<p>The concert took place on May 15.</p>
<h2 id="Specifications" name="Specifications">Specifications</h2>
<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{SpecName('HTML WHATWG', '#the-time-element', '&lt;time&gt;')}}</td>
   <td>{{Spec2('HTML WHATWG')}}</td>
   <td>No change from {{SpecName('HTML5.1')}}</td>
  </tr>
  <tr>
   <td>{{SpecName('HTML5.1', 'grouping-content.html#the-time-element', '&lt;time&gt;')}}</td>
   <td>{{Spec2('HTML5.1')}}</td>
   <td>No change from {{SpecName('HTML5 W3C')}}</td>
  </tr>
  <tr>
   <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-time-element', '&lt;time&gt;')}}</td>
   <td>{{Spec2('HTML5 W3C')}}</td>
   <td>Initial definition.</td>
  </tr>
 </tbody>
</table>
<h2 id="Browser_compatibility">Browser compatibility</h2>
<p>{{CompatibilityTable}}</p>
<div id="compat-desktop">
 <table class="compat-table">
  <tbody>
   <tr>
    <th>Feature</th>
    <th>Chrome</th>
    <th>Firefox (Gecko)</th>
    <th>Internet Explorer</th>
    <th>Opera</th>
    <th>Safari</th>
   </tr>
   <tr>
    <td>Basic support</td>
    <td>33.0</td>
    <td>{{CompatGeckoDesktop("22.0")}}</td>
    <td>9.0</td>
    <td>22.0</td>
    <td>7.0</td>
   </tr>
  </tbody>
 </table>
</div>
<div id="compat-mobile">
 <table class="compat-table">
  <tbody>
   <tr>
    <th>Feature</th>
    <th>Android</th>
    <th>Chrome for Android</th>
    <th>Firefox Mobile (Gecko)</th>
    <th>IE Mobile</th>
    <th>Opera Mobile</th>
    <th>Safari Mobile</th>
   </tr>
   <tr>
    <td>Basic support</td>
    <td>2.1</td>
    <td>{{CompatUnknown}}</td>
    <td>{{CompatGeckoMobile("22.0")}}</td>
    <td>10.0</td>
    <td>11.50<br />
     Removed in 15.0</td>
    <td>4.0-4.1</td>
   </tr>
  </tbody>
 </table>
</div>
<h2 id="See_also" name="See_also">See also</h2>
<ul>
 <li>The {{HTMLElement("data")}} element, allowing to signal other kind of values.</li>
</ul>
<p>{{HTMLRef}}</p>
Revert to this revision