HTML5 Новые элементы
Новые элементы в HTML5
Ниже приведен список новых элементов HTML5 и описание того, для чего они используются.
Новые семантические/структурные элементы
HTML5 предлагает новые элементы для лучшей структуры документа:
| Тег | Описание |
|---|---|
| <article> | Определяет статью в документе |
| <aside> | Определяет содержание, кроме содержания страницы |
| <bdi> | Изолирует часть текста, который может быть отформатирован в другом направлении от другого текста за его пределами |
| <details> | Определяет дополнительные детали, которые пользователь может просматривать или прятать |
| <dialog> | Определяет диалоговый бокс или окно |
| <figcaption> | Определяет заголовок для элемента <figure> |
| <figure> | Определяет автономное содержание |
| <footer> | Определяет нижний колонтитул для документа или раздела |
| <header> | Определяет заголовок для документа или раздела |
| <main> | Определяет основное содержание документа |
| <mark> | Определяет помеченный / выделенный текст |
| <meter> | Определяет скалярное измерение в пределах определённого диапазона (датчик) |
| <nav> | Определяет навигационные ссылки |
| <progress> | Представляет ход выполнения задания |
| <rp> | Определяет, что показывать в браузерах, которые не поддерживают ruby аннотации |
| <rt> | Определяет пояснения / произношение символов (для восточноазиатской типографики) |
| <ruby> | Определяет аннотацию ruby (для восточноазиатской типографики) |
| <section> | Определяет раздел в документе |
| <summary> | Определяет видимый заголовок для элемента <details> |
| <time> | Определяет дату / время |
| <wbr> | Определяет возможный разрыв строки |
Узнать больше про HTML5 Семантика.
Новые элементы формы
| Тег | Описание |
|---|---|
| <datalist> | Определяет список предопределенных параметров для элементов управления вводом |
| <output> | Определяет результат расчета |
Узнать больше о старых и новых элементах формы в HTML Элементы формы.
Новые типы ввода / input type
| Новые типы ввода | Новые атрибуты ввода |
|---|---|
|
|
Узнайте все о старых и новых типах ввода в HTML Типы ввода.
Узнайте все об атрибутах ввода в HTML Атрибуты ввода.
HTML5 - Синтаксис новых атрибутов
HTML5 допускает четыре разных синтаксиса для атрибутов.
Этот пример демонстрирует различные синтаксисы, используемые в теге <input>:
| Type | Пример |
|---|---|
| Пустой | <input type="text" value="John" disabled> |
| Без кавычек | <input type="text" value=John> |
| Двойные кавычки | <input type="text" value="John Doe"> |
| Одинарные кавычки | <input type="text" value='John Doe'> |
В HTML5 могут использоваться все четыре синтаксиса, в зависимости от того, что требуется для атрибута.
HTML5 Графика
| Тег | Описание |
|---|---|
| <canvas> | Рисование графики на лету с помощью скриптов (обычно JavaScript) |
| <svg> | Рисование масштабируемой векторной графики |
Узнать больше про HTML5 Canvas.
Узнать больше про HTML5 SVG.
Новые медиа элементы
| Тег | Описание |
|---|---|
| <audio> | Определяет звуковой контент |
| <embed> | Определяет контейнер для внешнего (не HTML) приложения |
| <source> | Определяет несколько медиа-ресурсов для медиа-элементов (<video> и <audio>) |
| <track> | Определяет текстовые дорожки для медиа-элементов (<video> и <audio>) |
| <video> | Определяет видео или фильм |
Узнать больше про HTML5 Видео.
Узнать больше про HTML5 Аудио.
