Атрибут datetime HTML тега <time>html5

HTML тег <time>

Значение и применение

Атрибут datetime представляет собой машиночитаемую дату / время в элементе. Данный атрибут используется с элементом семантической разметки <time>, который предназначен для поисковых систем, либо пользовательских браузеров, которые видят не какую-то нейтральную разметку, а данные, которые они могут идентифицировать. Внутри тега можно установить дату/время/период (или всё вместе) в удобном формате, а в атрибуте datetime указать дату уже в машиночитаемом виде.

Поддержка браузерами

АтрибутChrome
Chrome
Firefox
Firefox
Opera
Opera
Safari
Safari
Internet Explorer
IExplorer
Microsoft Edge
Edge
datetimehtml56.04.011.15.09.012.0

Синтаксис:

<time datetime="YYYY-MM-DDThh:mm:ssTZD | PTDHMS"> </time>

Значения атрибута

ЗначениеОписание
YYYY-MM-DDThh:mm:ssTZD YYYY - год (например, 2016)
MM - месяц (например, 05 для Мая)
DD – день месяца (например, 11)
T или пробел - разделитель
hh - часы (например, 23)
mm - минуты (например, 57)
ss - секунды (например, 21)
TZD - Time Zone Designator (часовой пояс):
  • UTC(Coordinated Universal Time) - всемирное координированное время, обозначается буквой Z.
  • +hh:mm(использование локального часового пояса) например, -03:00(отклонение от UTC)
  • -hh:mm(использование локального часового пояса) например, +03:00(отклонение от UTC)
2016-12-31T12:00:00+03:00 - Декабрь 31, 2016 год, 12-00, Московское время.
2016-12-31T09:00:00Z - соответствуют тому же временному значению.
PTDHMS P - префикс для периода
T или пробел - разделитель
D - префикс для дней (например, 2D)
H - префикс для часов (например, 20H)
M - префикс для минут (например, 55M)
S – префикс для секунд (например, 5S)

Пример использования

Семантическая разметка:

<time> 17:00 </time> <!--значит 17:00-->

Даты:

<time datetime="2016"> <!--значит 2016 год-->
<time datetime="2016-12"> <!--значит декабрь 2016 года --> 
<time datetime="2016-12-31">  <!--значит 31 декабря 2016 года --> 
<time datetime="12-31">  <!--значит 31 декабря любого года--> 
<time datetime="2017-W1"> <!--значит 1 неделя 2017 года --> 

Даты и время:

<time datetime="2016-12-31T22:00">  <!--значит 31 декабря 2016 года в 10 вечера --> 
<time datetime="2016-12-31 22:00"> <!--также без T --> 
<time datetime="2016-12-31 22:45:50.777"> <!--с минутами, секундами и миллисекундами --> 

Время:

<time datetime="07:00">  <!--значит 7 часов утра --> 
<time datetime="07:00-03:00"><!--значит 7 часов утра (UTC - Всемирное координированное время минус 3 часа --> 
<time datetime="08:00+03:00"> <!-- значит 7 часов утра (UTC - Всемирное координированное время плюс 3 часа) --> 

Длительность:

<time datetime="P2D"> <!--длительность 2 дня --> 
<time datetime="PT20H25M"> <!--длительность 20 часов and 25 минут --> 

Размещение на странице:

<!DOCTYPE html>
<html>
<head>
<title> Пример использования атрибута datetime HTML тега <time></title>
<style> 
time {
background-color : lime; /* устанавливаем цвет заднего фона */
}
</style>
</head>
<body>
<p> Мы запланировали вечеринку в <time datetime="2016-12-31 22:00"> Новый Год в 22:00 </time></p>
</body>
</html> 
Пример использования атрибута datetime HTML тега <time>(машиночитаемая дата).
Пример использования атрибута datetime HTML тега <time>(машиночитаемая дата).
HTML тег <time>