HTML: time

By Xah Lee. Date: . Last updated: .

The time tag is used to represent date, time, date+time, duration.

Example:

<p>Captain's log, <time>2011-07-03</time>.</p>
<p>Captain's log, <time>2011-07-03 12:51:02-07:00</time>.</p>
<p>I had lunch at <time>13:58</time>.</p>

Here's another example, with the optional datetime attribute:

<p>I need this <time datetime="2011-07-03 12:28:57-07:00">now</time>!</p>

The datetime attribute is optional. But if not present, then the time tag's content must use the same fomat used by datetime attribute.

“datetime” Attribute

datetime attribute's value is a machine-readable date/time format.

Examples:

<!-- date only -->
mom's birthday <time datetime="2011-07-03">July 3rd</time>
<!-- date and time -->
meeting at <time datetime="2011-07-03 13:00">1 pm</time>
<!-- full date time -->
conference <time datetime="2011-07-03 12:46:03-07:00">12:46:03 PST</time>

“datetime” Attribute Formats

Examples of valid datetime formats:

The space between {date, time} can also be T. Example: 2011-07-03T13:58

The above are the most commonly needed format. The spec also allow {fraction of second, time zone only, year+week, duration}.

Incorrect Use of Time Tag

<!-- incorrect use of time tag -->

<time>today</time>
<!-- incorrect format -->

<time>July 3</time>
<!-- incorrect format -->

<time>07/03/11</time>
<!-- incorrect format -->

<time>Sun Jul 03 13:20:16 2011</time>
<!-- incorrect format -->

thanks to Manuel Strehl https://twitter.com/m_strehl for correction.

back to HTML5 Tags Complete List

Liket it? Put $5 at patreon.

Or, Buy JavaScript in Depth

If you have a question, put $5 at patreon and message me.

Web Dev Tutorials

  1. HTML
  2. Visual CSS
  3. JS in Depth
  4. JS Reference
  5. DOM
  6. SVG
  7. Web Dev Blog