Тег time html5 – Тег time, дата и время — Разметка текста — HTML Academy

Содержание

Тег | htmlbook.ru

Internet Explorer Chrome Opera Safari Firefox Android iOS
9.0+ 8.0+ 9.2+ 5.0+ 4.0+ 2.0+ 1.0+

Спецификация

HTML: 3.2 4.01 5.0 XHTML: 1.0 1.1

Описание

Помечает текст внутри тега <time> как дата, время или оба значения. Может указываться непосредственно внутри контейнера <time>, либо задаваться через атрибут datetime.

Синтаксис

<time>дата и время</time>
<time datetime="<дата и время>">текст</time>
  

Атрибуты

datetime
Задает дату, время или оба значения для текста.
pubdate
Указывает дату публикации документа.

Закрывающий тег

Обязателен.

Пример

HTML5IE 8IE 9CrOpSaFx

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>time</title>
  <style>
   time { background: #f0f0f0; }
  </style>
 </head> 
 <body>
  <article>
   <p><time>1957-10-04</time> запущен первый искусственный спутник Земли.</p>
   <p><time>1960-08-19</time> первый полет собак в космос.</p>
   <p><time>1961-04-12</time> первый полет человека в космос.</p>
   <p><time>1963-06-16</time> первый полет женщины-космонавта.</p>
   <p><time>1969-07-21</time> высадка человека на Луну.</p>
  </article>
 </body> 
</html>

Браузеры

Браузеры, которые не поддерживают тег <time>, отображают его содержимое. Браузеры с поддержкой тега могут устанавливать для элемента стилевое оформление.

Тег | HTML справочник

HTML теги

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

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

Машиночитаемая разметка используется поисковыми системами и пользовательскими браузерами, которые видят не какую-то нейтральную разметку, а данные, которые они могут идентифицировать.

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

Синтаксис:

<time datetime = "YYYY-MM-DDThh:mm:ssTZD | PTDHMS"> </time>, где:
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 - соответствуют тому же временному значению.

P - префикс для периода
T или пробел - разделитель
D - префикс для дней (например, 2D)
H - префикс для часов (например, 20H)
M - префикс для минут (например, 55M)
S – префикс для секунд (например, 5S)

Атрибуты

АтрибутЗначениеОписание
datetimeYYYY-MM-DDThh:mm:ssTZD

PTDHMS

Представляет собой машиночитаемую дату / время в элементе.

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

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

<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="PT20h35M"> <!--длительность 20 часов and 25 минут --> 

Пример семантической и машиночитаемой разметки

<!DOCTYPE html>
<html>
<head>
	<title> Пример использования 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> 
Пример использования HTML тега <time> (семантическая разметка и машиночитаемая дата).

Значение CSS по умолчанию

Нет.

Поддержка глобальных атрибутов

Элемент поддерживает "глобальные атрибуты".

Атрибуты событий

Элемент поддерживает "атрибуты событий".

HTML теги

| HTML | WebReference

Помечает текст внутри элемента <time> (от англ. time — время) как дата, время или оба значения. Может указываться непосредственно внутри контейнера <time>, либо задаваться через атрибут datetime.

Синтаксис

<time>дата и время</time>
<time datetime="<дата и время>">текст</time>
  

Закрывающий тег

Атрибуты

datetime
Задаёт дату, время или оба значения для текста.
pubdate
Указывает дату публикации документа.

Пример

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>time</title>
  <style>
   time { background: #f0f0f0; }
  </style>
 </head> 
 <body>
  <article>
   <p><time>1957-10-04</time> запущен первый искусственный спутник Земли.</p>
   <p><time>1960-08-19</time> первый полёт собак в космос.</p>
   <p><time>1961-04-12</time> первый полёт человека в космос.</p>
   <p><time>1963-06-16</time> первый полёт женщины-космонавта.</p>
   <p><time>1969-07-21</time> высадка человека на Луну.</p>
  </article>
 </body> 
</html>

Примечание

Браузеры, которые не поддерживают <time>, отображают его содержимое.

Спецификация ?

Спецификация

Каждая спецификация проходит несколько стадий одобрения.

  • Recommendation (Рекомендация) — спецификация одобрена W3C и рекомендована как стандарт.
  • Candidate Recommendation (Возможная рекомендация) — группа, отвечающая за стандарт, удовлетворена, как он соответствует своим целям, но требуется помощь сообщества разработчиков по реализации стандарта.
  • Proposed Recommendation (Предлагаемая рекомендация) — на этом этапе документ представлен на рассмотрение Консультативного совета W3C для окончательного утверждения.
  • Working Draft (Рабочий проект) — более зрелая версия черновика после обсуждения и внесения поправок для рассмотрения сообществом.
  • Editor's draft (Редакторский черновик) — черновая версия стандарта после внесения правок редакторами проекта.
  • Draft (Черновик спецификации) — первая черновая версия стандарта.

Особняком стоит живой стандарт HTML (Living) — он не придерживается традиционной нумерации версий, поскольку находится в постоянной разработке и обновляется регулярно.

×

Браузеры

В таблице браузеров применяются следующие обозначения.

  •  — элемент полностью поддерживается браузером;
  •  — элемент браузером не воспринимается и игнорируется;
  •  — при работе возможно появление различных ошибок, либо элемент поддерживается с оговорками.

Число указывает версию браузреа, начиная с которой элемент поддерживается.

×

Автор и редакторы

Автор: Влад Мержевич

Последнее изменение: 10.10.2018

Редакторы: Влад Мержевич

Курс по вёрстке сайта на CSS Grid

Атрибут datetime тега | HTML справочник

HTML тег <time>

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

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

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

Синтаксис:

<time datetime="YYYY-MM-DDThh:mm:ssTZD | PTDHMS"&gt </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="PT20h35M"> <!--длительность 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>(машиночитаемая дата).HTML тег <time>

| Справочник HTML



Элемент <time> (от англ. "time" ‒ «время, момент») позволяет указывать время в 24-часовом формате или точную дату по Григорианскому календарю , с возможностью указать время и смещение часового пояса.

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

  • Дата и время задаётся в международном формате ISO 8601 — ru.wikipedia.org/wiki/ISO_8601 внутри элемента <time>. При этом внутри элемента кроме данной записи не должно располагаться ни чего постороннего (например, текста не соответствующего стандарту, других элементов).
  • Указание даты и времени в международном формате ISO 8601 — ru.wikipedia.org/wiki/ISO_8601 в атрибуте datetime. В этом случае внутрь элемента можно вкладывать любое содержимое.

Примечание: Этот элемент неуместно использовать, когда точная дата не определена, также дата по Григорианскому календарю должна быть положительной, то есть нельзя указывать даты до Рождества Христова (из-за осложнений расчетов таких дат).

Синтаксис

<time>дата и время</time>
<time datetime="дата и время">текст</time>

Закрывающий тег

Обязателен.

Атрибуты

datetimeHTML5
Указывает дату/время в машиносчитываемом формате. Время указывается в формате - YYYY-MM-DDThh:mm:ssTZD:
  • YYYY - год (пример: 2017)
  • MM - месяц (пример: 05 для мая)
  • DD - день месяца (пример: 01)
  • T - разделитель между датой и временем
  • hh - час (пример: 22 для 10.00pm)
  • mm - минуты (пример: 30)
  • ss - секунды (пример: 59)
  • TZD (Time Zone Designator) - обозначение часового пояса (пример +03:00)
В атрибуте datetime можно опустить лишние детали, указав только время или дату.

Для этого элемента доступны глобальные атрибуты и события.

Стилизация по умолчанию

Нет.

Различия между HTML 4.01 и HTML5

Тег <time> был добавлен в HTML5.

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

Определяем дату и время:

Пример HTML:

Попробуй сам
<time datetime="7:00">7 часов утра</time>
<time datetime="2018-02-14">День святого Валентина</time>

Спецификации

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

Элемент
<time> 9+ 33+ 22+ Да 7+ 22+
Элемент
<time> 2.1+ 22+ 11.50+ 4.1+

Учебник HTML

HTML Элементы



Тег | HTML справочник

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

12.0+ 9.0+ 4.0+ 6.0+ 11.1+ 5.0+

Описание

HTML тег <time> позволяет указывать время в 24-часовом формате или точную дату по Григорианскому календарю, с возможностью указать время и смещение часового пояса. Он предназначен для представления даты и времени в машиносчитываемом формате и отображения их на веб-странице в привычном для нас виде. Это может быть полезно для планировки событий в календаре пользователя, поисковым системам это поможет точнее производить результаты поиска.

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

Примечание: этот элемент не подходит для случаев, где невозможно рассчитать точную дату, например не известно конкретное число месяца - "май 2034", также дата по Григорианскому календарю должна быть положительной, то есть нельзя указывать даты до Рождества Христова (из-за осложнений расчетов таких дат).

Атрибуты

datetime:
Указывает дату/время в машиносчитываемом формате. Время указывается в формате - YYYY-MM-DDThh:mm:ssTZD:
  • YYYY - год (пример: 2009)
  • MM - месяц (пример: 07 для июля)
  • DD - день месяца (пример: 01)
  • T - разделитель между датой и временем
  • hh - час (пример: 23 для 11.00pm)
  • mm - минуты (пример: 21)
  • ss - секунды (пример: 59)
  • TZD (Time Zone Designator) - обозначение часового пояса (пример +07:00)
В атрибуте datetime можно опустить лишние детали, указав только время или дату:

<time datetime="20:00">8 часов вечера</time>
<time datetime="2015-02-14">День святого Валентина</time>

Примечание: поисковые системы могут использовать информацию представленную в атрибуте datetime в результатах поиска, для выведения даты последнего обновления документа.

Стиль по умолчанию

Нет.

Пример


<!DOCTYPE html>
<html>
  <body>

    <p>Мы открываемся в <time>10:00</time> каждое утро.</p>

  </body>
</html>

Результат данного примера в окне браузера:

Пример использования тега <time>

Атрибут datetime | htmlbook.ru

Internet Explorer Chrome Opera Safari Firefox Android iOS
9.0+ 8.0+ 9.2+ 5.0+ 4.0+ 2.0+ 1.0+

Спецификация

HTML: 3.2 4.01 5.0 XHTML: 1.0 1.1

Описание

Устанавливает дату, время или оба значения для текста. Содержимое атрибута напрямую в браузере не отображается.

Синтаксис

<time datetime="<дата и время>">текст</time>
  

Значения

Дата и время задается в международном формате ISO 8601. Примеры оформления приведены в табл. 1.

Табл. 1. Форматы даты и времени
Значение Формат Пример
Год ГГГГ 2012
Месяц и год ГГГГ-ММ 2012-12
Полная дата ГГГГ-ММ-ДД 2012-12-23
Дата и время с минутами ГГГГ-ММ-ДДTчч:мм 2004-07-24T18:18
Дата и время с секундами ГГГГ-ММ-ДДTчч:мм:сс 2004-07-24T18:18:18
Дата и время с часовым поясом ГГГГ-ММ-ДДTчч:мм:сс±чч:мм 2004-07-24T18:18:18+04:00

Для каждой единицы существует своя заданная форма и ограничения.

  • Год — задается четырьмя цифрами (1860).
  • Месяц — две цифры (01 — январь, 02 — февраль, 12 — декабрь).
  • День — две цифры от 01 до 31.
  • Час — две цифры от 00 до 23.
  • Минуты — две цифры от 00 до 59.
  • Секунды — две цифры от 00 до 59.
  • Часовой пояс — часы и минуты с указанием знака плюс или минус.

Дата и время разделяются между собой заглавной латинской буквой T. Часовой пояс при необходимости пишется после времени со знаком плюс или минус. К примеру, для Москвы часовой пояс будет +04:00.

Значение по умолчанию

Нет.

Пример

HTML5IE 8IE 9CrOpSaFx

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>datetime</title>
 </head> 
 <body>
  <article>
   <p>Опубликовано: <time datetime="2012-12-23T08:23:11+07:00">сегодня</time></p>
   <p><time>1957-10-04</time> запущен первый искусственный спутник Земли.</p>
   <p><time>1960-08-19</time> первый полет собак в космос.</p>
   <p><time>1961-04-12</time> первый полет человека в космос.</p>
   <p><time>1963-06-16</time> первый полет женщины-космонавта.</p>
   <p><time>1969-07-21</time> высадка человека на Луну.</p></article>
 </body> 
</html>

Отправить ответ

avatar
  Подписаться  
Уведомление о