HTML5 теги
HTML теги являются основой языка HTML. Каждый тег несет в себе определенную информацию, может описывать документ в общем или способ форматирования текста. Все содержимое веб-страницы задается с помощью тегов.
Тег помещается в угловые скобки <тег>. Чаще всего для тега задается парный закрывающий тег, но в некоторых случаях он отсутствует. Информация, заключенная между открывающим и закрывающим тегом, называется его контейнером.
В предложенной ниже таблице приведен полный список тегов, поддерживаемых HTML4 и HTML5.
Полный список тегов HTML5
| Тег | Описание |
|---|---|
| <!–…–> | Используется для добавления комментариев. |
| <!DOCTYPE> | Описывает создаваемый документ и предоставляет основную информацию для браузера. |
| <a> | Используется для создания ссылок. |
| <abbr> | Определяет текст как аббревиатуру с помощью атрибута title. |
| <address> | Задает контактные данные автора/владельца документа или статьи. |
| <area> | Определяет область внутри изображения-карты (изображения с активной областью). Всегда вложен внутрь тега <map>. |
| <article> | Тег для задания независимого логически завершенного блока контента. Потенциальные источники: сообщение форума, блога, новости, комментарии. |
| <aside> | Определяет вторичный или связанный контент в стороне от основного контента страницы. |
| <audio> | Загружает звуковой контент на веб-страницу. |
| <b> | Задает полужирное начертание шрифта. |
| <base> | Задает базовый адрес (URL), относительно которого вычисляются все относительные адреса. Это поможет избежать проблем при переносе страницы в другое место, так как все ссылки будут работать, как и прежде. |
| <bdi> | Изолирует части текста, которые могут быть отформатированы в направлении, отличном от другого текста за их пределами. |
| <bdo> | Задает направление вывода текста преимущественно для языков, в которых чтение текста происходит справа налево. |
| <blockquote> | Определяет выделенный текст как цитату, применяется для описания больших цитат. |
| <body> | Внутри этого тега располагается документ. Текст, находящийся внутри этих тегов, будет отображаться браузером. |
| <br> | Перенос текста на новую строку. |
| <button> | Создает интерактивную кнопку. Внутрь тега можно поместить содержимое – текст или изображение. |
| <canvas> | Используется для отрисовки графики, “на лету”, с помощью скриптов (обычно это JavaScript). Представляет собой контейнер для графики, для рисования необходим скрипт. |
| <caption> | Определяет заголовок (подпись) таблицы. Добавляется непосредственно после тега <table>. |
| <cite> | Отмечает небольшую цитату или сноску, взятую из другого источника. |
| <code> | Указывает на программный код. |
| <col> | Предназначен для форматирования групп столбцов, не содержащих информацию одного типа. |
| <colgroup> | Создает структурную группу столбцов, выделяющую множество логически однородных ячеек. |
| <datalist> | Задает выпадающий список для элемента <input>. |
| <dd> | Используется для описания термина из тега <dt>. |
| <del> | Помечает текст как удаленный. |
| <details> | Задает дополнительные сведения, которые пользователь по желанию может просмотреть или скрыть. Позволяет размещать любой контент внутри тега. |
| <dfn> | Выделяет текст как определение. |
| <dialog> | Служит для создания диалоговых окон на странице. |
| <div> | Выделяет большие блоки текста для форматирования с помощью CSS-стилей. |
| <dl> | Тег-контейнер, внутри которого находятся определение и описание термина. |
| <dt> | Используется для задания определения. |
| <em> | Выделяет важные фрагменты текста. |
| <embed> | Определяет внешний интерактивный контент или плагин. |
| <fieldset> | Группирует связанные элементы в форме, рисуя рамку вокруг них. |
| <figcaption> | Задает заголовок для элемента <figure>. |
| <figure> | Используется для группирования медиа-контента, например, изображения и подписи к нему. |
| <footer> | Определяет завершающую область документа или раздела. |
| <form> | Добавляет на страницу форму, позволяющую организовать сбор информации от посетителей сайта. Не имеет смысла без атрибута action. |
| <h1-h6> | Создает заголовки шести уровней. |
| <head> | Используется для служебных целей, содержит множество данных, указывающих браузеру, как следует обрабатывать веб-страницы. Введенная в нем информация не отображается в окне браузера. Внутри тегов <head> используются следующие теги: <title>, <meta>, <script>, <link>, <style>. |
| <header> | Определяет заголовок страницы или раздела. |
| <hr> | Создает горизонтальную линию на веб-странице. |
| <html> | Определяет html-документ, все содержимое страницы записывается внутри его контейнера. |
| <i> | Отображает выделенный текст курсивом. |
| <iframe> | Создает встроенный фрейм, загружая в текущий html-документ другой документ. |
| <img> | Встраивает изображения в HTML-документ с помощью атрибута src, значением которого является адрес встраиваемого изображения. |
| <input> | Создает поля для формы. |
| <ins> | Отмечает текст как вставку, применяется для выделения изменений, вносимых в документ. |
| <kbd> | Помечает текст, вводимый пользователем с клавиатуры. |
| <keygen> | Генерирует пару ключей – закрытый и открытый. При отправке формы, закрытый ключ хранится локально, и открытый ключ отправляется на сервер. Работает внутри тега <form>. |
| <label> | Добавляет текстовую метку для элемента <input>, связывая саму надпись и поле ввода при помощи идентификатора id. |
| <legend> | Формирует заголовок группы элементов формы, заданных при помощи элемента <fieldset>. |
| <li> | Задает элемент маркированного и нумерованного списка. |
| <link> | Определяет отношения между текущей страницей и другими документами, а также подключает файл с таблицами стилей к документу. Закрывающий тег не требуется. |
| <main> | Задает основное содержимое документа. Содержимое внутри элемента должно быть уникальным. Оно не должно содержать контент, который повторяется во всех частях документах, таких как боковые панели, навигационные ссылки, информацию об авторских правах, логотипы сайта, и поисковые формы. |
| <map> | Используется для определения изображения-карты, изображения с активной областью. Является контейнером для элементов <area>. |
| <mark> | Используется для выделения текста. |
| <menu> | Определяет список меню/команд. Используется для контекстных меню, панели инструментов и для включения элементов управления формы и команд. |
| <menuitem> | Определяет команду/пункт меню, которые пользователь может вызвать из всплывающего меню. |
| <meta> | Используется для хранения дополнительной информации о странице. Эту информацию используют браузеры для обработки страницы, а поисковые системы – для ее индексации. В блоке <head> может быть несколько тегов <meta>, потому что в зависимости от используемых атрибутов они несут разную информацию. |
| <meter> | Определяет измерения в заранее заданном диапазоне. |
| <nav> | Задает навигационные ссылки по сайту. |
| <noscript> | Определяет секцию, не поддерживающую сценарий (скрипт). |
| <object> | Определяет контейнер, в который встраивается элемент мультимедиа (например, аудио, видео, Java-апплеты, ActiveX, PDF и Flash). Также можно другую веб-страницу в HTML-документ. Дополнительно внутрь контейнера <object> можно поместить тег <param> для передачи дополнительных параметров плагинов. |
| <ol> | Создает упорядоченный нумерованный список. |
| <optgroup> | Является контейнером для группы тегов <option>, представляя варианты для выбора в раскрывающемся списке. |
| <option> | Определяет вариант в раскрывающемся списке. |
| <output> | Представляет собой результат вычисления (обычно рассчитанный с помощью скрипта). |
| <p> | Организует абзацы, разделяя текст на логические части. |
| <param> | Определяет параметр для объекта. |
| <pre> | Позволяет вводить текст без форматирования, с сохранением пробелов и переносов текста. |
| <progress> | Определяет ход выполнения задачи любого рода. |
| <q> | Определяет краткую цитату. |
| <rp> | Используется для вывода текста в браузерах, которые не поддерживают тег <ruby>. |
| <rt> | Добавляет краткую характеристику сверху или снизу от символов (для типографики Восточной Азии), заключенных в элементе <ruby>, выводится уменьшенным шрифтом. |
| <ruby> | Используются для аннотаций в типографике Восточной Азии, и показывают объяснение Восточно-Азиатских символов. |
| <s> | Отображает текст перечеркнутым. |
| <samp> | Используется для вывода текста, представляющего результат выполнения программного кода или скрипта, отображается моноширинным шрифтом. |
| <script> | Используется для определения сценария на стороне клиента (обычно JavaScript). Содержит либо текст скрипта, либо указывает на внешний файл сценария с помощью атрибута src. |
| <section> | Определяет логическую область (раздел) страницы. |
| <select> | Используется для создания списков для формы. |
| <small> | Отображает выделенный текст шрифтом меньшего размера. |
| <source> | Используется для указания медиа-ресурсов для мультимедийных элементов, таких как <video> и <audio>. |
| <span> | Выделяет часть текста и позволяет форматировать отрывки текста внутри другого элемента. |
| <strong> | Расставляет акцент на тексте, выделяя его полужирным. |
| <style> | Внутри этого тега задаются стили, используемые на странице. Этих тегов на странице может быть несколько. |
| <sub> | Задает подстрочное написание символов. |
| <summary> | Определяет видимый заголовок для тега <details>. Отображается в виде закрашенного треугольника, кликнув по которому можно просмотреть подробности заголовка. |
| <sup> | Задает надстрочное написание символов. |
| <table> | Тег для создания таблицы. |
| <tbody> | Определяет тело таблицы. |
| <td> | Создает ячейку таблицы. |
| <textarea> | Создает большие поля для ввода текста. |
| <tfoot> | Определяет нижний колонтитул таблицы. |
| <th> | Создает заголовок ячейки таблицы. |
| <thead> | Определяет заголовок таблицы. |
| <time> | Определяет дату/время. |
| <title> | Задает название страницы, которое будет отображаться в строке с названием приложения окна браузера. Текст, содержащийся внутри, отображается в качестве заголовка страницы. |
| <tr> | Создает строку таблицы. |
| <track> | Используется для указания субтитров для медиа-элементов (<audio> и <video>) |
| <u> | Создает подчеркнутый текст. |
| <ul> | Создает маркированный список. |
| <var> | Выделяет переменные из программ. |
| <video> | Добавляет на страницу видео-файлы. Поддерживает 3 видео формата: MP4, WebM, Ogg. |
| <wbr> | Указывает браузеру возможное место разрыва длинной строки. |
