Главная » Языки программирования

Time tag in html

Содержание
  1. : The (Date) Time element
  2. Try it
  3. Attributes
  4. Usage notes
  5. Valid datetime values
  6. Time tag in html
  7. Кратко
  8. Пример
  9. Как пишется
  10. Как понять
  11. Примеры в машинном формате
  12. HTML Tag
  13. Syntax
  14. Example of the HTML tag:
  15. Result
  16. Attributes
  17. How to style tag?
  18. Common properties to alter the visual weight/emphasis/size of text in tag:
  19. Coloring text in tag:
  20. Text layout styles for tag:
  21. Other properties worth looking at for tag:
  22. Browser support

: The (Date) Time element

The HTML element represents a specific period in time. It may include the datetime attribute to translate dates into machine-readable format, allowing for better search engine results or custom features such as reminders.

It may represent one of the following:

  • A time on a 24-hour clock.
  • A precise date in the Gregorian calendar (with optional time and timezone information).
  • A valid time duration.

Try it

Attributes

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

This attribute indicates the time and/or date of the element and must be in one of the formats described below.

Usage notes

This element is for presenting dates and times in a machine-readable format. For example, this can help a user agent offer to add an event to a user’s calendar.

This element should not be used for dates prior to the introduction of the Gregorian calendar (due to complications in calculating those dates).

The datetime value (the machine-readable value of the datetime) is the value of the element’s datetime attribute, which must be in the proper format (see below). If the element does not have a datetime attribute, it must not have any element descendants, and the datetime value is the element’s child text content.

Читайте также:  Свойства шрифтов в html

Valid datetime values

a valid yearless date string

a valid local date and time string

a valid global date and time string

Источник

Time tag in html

Разметка для даты и времени — и для людей, и для роботов.

Время чтения: меньше 5 мин

Обновлено 27 декабря 2021

Кратко

Скопировать ссылку «Кратко» Скопировано

Элемент служит для разметки дат, времени или периода времени: в содержимое тега идёт формат для человека, а в атрибут datetime версия для машин — поисковому роботу точно понравится 🙂

Пример

Скопировать ссылку «Пример» Скопировано

Так можно указать конкретную дату:

 Дока вышла в релиз  Дока вышла в релиз time datetime="2021-10-12">12 октября 2021time>      
 Челябинский метеорит вошёл в земную атмосферу  15 февраля 2013 около 09:20  Челябинский метеорит вошёл в земную атмосферу time datetime="2013-02-15T09:20+06:00"> 15 февраля 2013 около 09:20 time>

А так можно указать временной интервал:

 Самый длинный клип Twenty One Pilots на песню Level of Concern длится Самый длинный клип Twenty One Pilots на песню Level of Concern длится time datetime="117d 16h 10m 25s">177 дней, 16 часов, 10 минут и 25 секундtime>

Как пишется

Скопировать ссылку «Как пишется» Скопировано

Вся магия элемента кроется в атрибуте datetime , который принимает значение формата
YYYY — MM — DD Thh : mm : ssTZD .

  • YYYY : год 4 цифры (прим. 2009);
  • MM : месяц 2 цифры (прим. 05);
  • DD : день 2 цифры (прим. 04);
  • T : разделитель даты и времени, можно заменить пробелом;
  • hh : часы 2 цифры (прим. 18 для 06.00pm);
  • mm : минуты 2 цифры (прим. 34);
  • ss : секунды 2 цифры (прим. 40);
  • TZD : Обозначение часового пояса (прим. +02:00 для Каира).
  time datetime="2021-07">Солнечный июльtime>

Который можно опустить, если внутри тэга валидное значение атрибута datetime :

  time>2021-07time>

Как понять

Скопировать ссылку «Как понять» Скопировано

Все мы работаем с датами: напоминания, сообщения, события. Представьте, что браузер или любой другой HTML-интерпретатор сможет распознать существующие даты на странице.

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

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

Примеры в машинном формате

Скопировать ссылку «Примеры в машинном формате» Скопировано

Содержимое атрибута datetime для машин чаще всего и генерируется машиной, но если вы человек и вам нужно указать его самостоятельно, либо написать скрипт для такого вывода, эти примеры для вас.

Год и месяц
2014 — 06
Год перед месяцем.

Дата
1969 — 07 — 16
Год, месяц, потом день.

Дата без года
12 — 31
Месяц перед днём.

Только время
14 : 54 : 39 . 929
Час, минуты, потом секунды. Секунды не обязательно. Доли можно указать тремя цифрами после точки.

Дата и Время
2013 — 11 — 20 T14 : 54
Комбинация даты и времени, разделяется заглавной T .

Временная зона
+06 : 00
Начинается с плюса или минуса. Двоеточие не обязательно. +00:00, или UTC время, можно указать большой буквой Z .

Локальное время и дата
2019 — 12 — 31 T23 : 59 : 59 — 02 : 00

То же самое, что дата и время, только с временной зоной.

Год и Неделя
2010 — W21
Сначала год, потом количество недель после большой W .

Только Год
1776
4 цифры или больше, работает и так 0001 , и так 12345 .

Длительность (Способ 1)
P2DT2H30M10 . 501S
Заглавная P , день (необязательно), заглавная T , дальше необязательные часы, минуты и секунды. Все буквы должны быть заглавными.

Длительность (Способ 2)
1w 2d 2h 30m 10 . 501s
Неделя ( w ), день ( d ), час ( h ), минута ( m ) и секунда ( s ). Буквы могут быть маленькими и большими. Пробелы не обязательны.

Источник

HTML Tag

The tag is one of the HTML5 elements. It is used to define one of the following:

  • a human-readable time on a 24-hour clock,
  • a precise date in the Gregorian calendar (giving optional timezone and time information),
  • a valid time duration.

The tag should not be used for dates that are prior to the introduction of the Gregorian calendar.

The datetime attribute is used to define machine-readable format, which allows search engines to produce smarter results and user agents to add reminders to the user’s calendar. When the datetime attribute is missing, the element should not have any element descendants. In this case, the datetime value will be the child text content of the element.

Syntax

The

Example of the HTML tag:

html> html> head> title>Title of the document. title> head> body> p>The game will be held on time datetime="2018-09-28 19:00">September 28 time>. p> p>It will start at time>19:00 time> p> body> html>

Result

time example

Attributes

Attribute Value Description
datetime Indicates the time/date of the element in the following formats:
YYYY — a four-digit year
MM — a two-digit month, 01 — 12
DD — a two-digit day, 01 — 31
T -specifies that a time value follows
hh -a two-digit hour, 00 — 24
mm — a two-digit minute, 00 — 59
ss -a two-digit second, 00 — 59
TZD — (Time Zone Designator) time zone

How to style tag?

Common properties to alter the visual weight/emphasis/size of text in tag:

  • CSS font-style property sets the style of the font. normal | italic | oblique | initial | inherit.
  • CSS font-family property specifies a prioritized list of one or more font family names and/or generic family names for the selected element.
  • CSS font-size property sets the size of the font.
  • CSS font-weight property defines whether the font should be bold or thick.
  • CSS text-transform property controls text case and capitalization.
  • CSS text-decoration property specifies the decoration added to text, and is a shorthand property for text-decoration-line, text-decoration-color, text-decoration-style.

Coloring text in tag:

  • CSS color property describes the color of the text content and text decorations.
  • CSS background-color property sets the background color of an element.

Text layout styles for tag:

  • CSS text-indent property specifies the indentation of the first line in a text block.
  • CSS text-overflow property specifies how overflowed content that is not displayed should be signalled to the user.
  • CSS white-space property specifies how white-space inside an element is handled.
  • CSS word-break property specifies where the lines should be broken.

Other properties worth looking at for tag:

  • CSS text-shadow property adds shadow to text.
  • CSS text-align-last property sets the alignment of the last line of the text.
  • CSS line-height property specifies the height of a line.
  • CSS letter-spacing property defines the spaces between letters/characters in a text.
  • CSS word-spacing property sets the spacing between words.

Browser support

Источник

Оцените статью
© 2024 Программирование