HTML-теги — основа языка HTML. Теги используются для разграничения начала и конца элементов в разметке.

Каждый HTML-документ состоит из дерева HTML-элементов и текста. Каждый HTML-элемент обозначается начальным (открывающим) и конечным (закрывающим) тегом. Открывающий и закрывающий теги содержат имя тега.

Все HTML-элементы делятся на пять типов:

  • пустые элементы — , ,
    , , , , , ,
    Используется для хранения дополнительной информации о странице. Эту информацию используют браузеры для обработки страницы, а поисковые системы — для ее индексации. В блоке может быть несколько тегов , так как в зависимости от используемых атрибутов они несут разную информацию. Индикатор измерения в заданном диапазоне. Раздел документа, содержащий навигационные ссылки по сайту. Определяет секцию, не поддерживающую сценарий (скрипт). Контейнер для встраивания мультимедиа (например, аудио, видео, Java-апплеты, ActiveX, PDF и Flash). Также можно вставить другую веб-страницу в текущий HTML-документ. Для передачи параметров встраиваемого плагина используется тег . Упорядоченный нумерованный список. Нумерация может быть числовая или алфавитная. Контейнер с заголовком для группы элементов . Определяет вариант/опцию для выбора в раскрывающемся списке , или . Поле для вывода результата вычисления, рассчитанного с помощью скрипта.

    Параграфы в тексте. Определяет параметры для плагинов, встраиваемых с помощью элемента . Элемент-контейнер, содержащий один элемент и ноль или несколько элементов . Сам по себе ничего не отображает. Дает возможность браузеру выбирать наиболее подходящее изображение. Выводит текст без форматирования, с сохранением пробелов и переносов текста. Может быть использован для отображения компьютерного кода, сообщения электронной почты и т.д. Индикатор выполнения задачи любого рода. Определяет краткую цитату. Контейнер для Восточно-Азиатских символов и их расшифровки. Определяет вложенный в него текст как базовый компонент аннотации. Добавляет краткую характеристику сверху или снизу от символов, заключенных в элементе , выводится уменьшенным шрифтом. Отмечает вложенный в него текст как дополнительную аннотацию. Выводит альтернативный текст в случае если браузер не поддерживает элемент . Отображает текст, не являющийся актуальным, перечеркнутым. Используется для вывода текста, представляющего результат выполнения программного кода или скрипта, а также системные сообщения. Отображается моноширинным шрифтом. Используется для определения сценария на стороне клиента (обычно JavaScript). Содержит либо текст скрипта, либо указывает на внешний файл сценария с помощью атрибута src . Определяет логическую область (раздел) страницы, обычно с заголовком. Элемент управления, позволяющий выбирать значения из предложенного множества. Варианты значений помещаются в . Отображает текст шрифтом меньшего размера. Указывает местоположение и тип альтернативных медиаресурсов для элементов , , . Контейнер для строчных элементов. Можно использовать для форматирования отрывков текста, например, выделения цветом отдельных слов. Расставляет акценты в тексте, выделяя полужирным. Подключает встраиваемые таблицы стилей. Задает подстрочное написание символов, например, индекса элемента в химических формулах. Создаёт видимый заголовок для тега . Отображается с закрашенным треугольником, кликнув по которому можно просмотреть подробности заголовка. Задает надстрочное написание символов.

    Таблица-шпаргалка с тегами

    Для удобства пользования я сгруппировала теги по тематическим разделам, добавив значения свойства display для каждого тега. Чтобы перейти к таблице, кликните по рисунку.

    Специальные символы HTML — это короткие фрагменты кода, называемые символьными сущностями. Они используются для отображения символов, имеющих в HTML особое значение, а также символов, которые не доступны на клавиатуре.

    Специальные символы HTML называются зарезервированными. Например, левые () угловые скобки зарезервированы в HTML для определения открывающих и закрывающих тегов.

    Символы, которые не доступны на клавиатуре, включают в себя такие знаки, как символ копирайта (©) и математическое значение пи.

    Если мы хотим использовать их в документе и выводить в браузере, нужно использовать ссылки на символы HTML .

    Практический пример

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

    This is a list of items.

    • List Item A
    • List Item B
    • List Item C

    Тег для создания таблицы.
    Определяет тело таблицы.
    Создает ячейку таблицы.
    Используется для объявления фрагментов HTML-кода, которые могут быть клонированы и вставлены в документ скриптом. Содержимое тега не является его дочерним элементом.
    Создает большие поля для ввода текста.
    Определяет нижний колонтитул таблицы.
    Создает заголовок ячейки таблицы.
    Определяет заголовок таблицы.
    Определяет дату/время.
    Заголовок HTML-документа, отображаемый в верхней части строки заголовка браузера. Также может отображаться в результатах поиска, поэтому это следует принимать во внимание предоставление названия.
    Создает строку таблицы.
    Добавляет субтитры для элементов и .
    Выделяет отрывок текста подчёркиванием, без дополнительного акцента.
    Создает маркированный список.
    Выделяет переменные из программ, отображая их курсивом.
    Добавляет на страницу видео-файлы. Поддерживает 3 видео формата: MP4, WebM, Ogg.
    Указывает браузеру возможное место разрыва длинной строки.