Тег <input> используется для создания различных элементов ввода данных на веб-странице.

Основные особенности:

- Позволяет создавать текстовые поля, чек-боксы, кнопки и другие элементы

- Дает возможность настраивать свойства этих элементов

- Помогает получать информацию от пользователей

Тег <ins> обычно используется при редактировании или обновлении контента на веб-странице, чтобы четко показать, что было добавлено.

Это очень полезно, особенно когда вы ведете учет изменений на сайте или делитесь черновиками с другими людьми.

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

Тег <kbd> используется для обозначения текста, представляющего ввод с клавиатуры.

Он помогает выделить клавиши или комбинации клавиш, которые нужно использовать.

Браузер отображает текст внутри <kbd> особым образом - обычно моноширинным шрифтом, чтобы он выглядел как настоящая клавиша.

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

Тег <label> используется для создания подписи или меток для элементов форм, таких как поля ввода, флажки или переключатели.

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

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

Тег <label> может использоваться двумя способами: либо обернув элемент формы внутри себя, либо используя атрибут for для связывания метки с элементом по его идентификатору.

Тег <legend> используется для создания заголовка или заглавия для группы элементов формы, обычно обозначенных тегом <fieldset>.

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

Текст, заключенный внутри тега <legend>, будет отображаться в верхней части соответствующего <fieldset>(тут), обеспечивая лучшее понимание структуры и назначения формы для пользователей.

Тег <li> используется для обозначения элемента списка внутри упорядоченного (<ol>) или неупорядоченного (<ul>) списка.

Каждый <li> элемент представляет собой одну запись или пункт в списке. Браузер обычно отображает их с маркером или нумерацией, в зависимости от типа списка.

Тег <li> позволяет структурировать контент на веб-странице, делая его более понятным и легким для чтения.

Тег <link> используется для установления связей между текущим документом HTML и другими ресурсами, такими как стилевые таблицы (CSS), иконки, RSS-ленты и т.д.

Основное назначение тега <link> - подключение внешних ресурсов, которые улучшают или дополняют содержание веб-страницы.

Наиболее распространенное использование - подключение таблиц стилей CSS с помощью атрибута rel="stylesheet". Это позволяет применять стили оформления к элементам HTML-документа.

Тег <main> используется для обозначения основного, центрального содержимого веб-страницы.

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

Использование <main> помогает структурировать документ, выделяя его ключевое содержимое.

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

Тег <map> используется для создания интерактивных изображений-карт на веб-странице. Он позволяет связать определенные области изображения с гиперссылками, что дает пользователям возможность взаимодействовать с картой.

Как правило, <map> используется совместно с тегом <img> для создания "горячих точек" на изображении. Эти "горячие точки" представляют собой области, которые реагируют на действия пользователя, например, наведение курсора или щелчок.

Внутри тега <map> размещаются элементы <area>, которые определяют форму и координаты "горячих точек" на изображении, а также связывают их с соответствующими ссылками или другими действиями.

Тег <mark> используется для выделения важных фрагментов текста на веб-странице.

Он привлекает внимание к ключевым словам, цитатам или другим значимым частям контента.

По умолчанию, браузеры отображают текст внутри <mark> с желтым фоном, но стили можно изменить с помощью CSS.

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

Тег <meter> используется для отображения измеримого значения в известном диапазоне.

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

Атрибуты min, max и value определяют диапазон и текущее значение.
Дополнительные атрибуты low, high и optimum задают границы оптимального интервала.

Браузеры обычно показывают <meter> в виде горизонтальной полосы, заполненной пропорционально текущему значению.
Внешний вид можно стилизовать с помощью CSS.

Тег <nav> обозначает навигационный блок на веб-странице.

Он предназначен для группировки ссылок, ведущих к другим страницам или разделам сайта.

<nav> помогает структурировать контент, улучшает доступность и облегчает навигацию, так как браузеры распознают этот семантический элемент.

Тег <object> используется для встраивания внешних ресурсов, таких как изображения, видео, PDF или другие мультимедийные элементы, в веб-страницу.

Он позволяет задавать параметры встраиваемого объекта, такие как ширина, высота и URL источника. Также <object> дает возможность указать альтернативный контент, который будет показан, если основной ресурс не может быть отображен.

Тег <ol> создает нумерованный список в HTML.

Он упорядочивает элементы в определенной последовательности, нумеруя их автоматически.

Каждый элемент списка оформляется тегом <li>. По умолчанию нумерация начинается с 1, но можно изменить ее тип с помощью атрибута type (1, a, A, i, I).

Начальный номер списка также можно задать с помощью атрибута start.

Списки <ol> могут быть вложенными, при этом внутренний список будет иметь свою собственную нумерацию.

Тег <optgroup> в HTML объединяет связанные элементы <option в выпадающем списке или <select>.

Он позволяет структурировать длинные списки, группируя варианты с общим названием, задаваемым атрибутом label. Это делает интерфейс более понятным для пользователя.

Внутри <optgroup> располагаются теги <option, представляющие конкретные варианты выбора. Группы могут быть вложенными.

Тег <option> используется внутри элемента <select> для создания вариантов выбора в раскрывающемся списке. Он позволяет задать текст варианта и его значение.

Основные атрибуты:
- value - значение варианта
- selected - делает вариант выбранным по умолчанию
- disabled - делает вариант недоступным для выбора

Тег <output> используется для представления результата вычислений или других типов выходных данных.

Он предназначен для отображения информации, которая была получена в результате действий, таких как вычисления, преобразования или манипуляции с данными.

Основные особенности тега <output>:

- Позволяет отображать результат вычислений, скриптов и других операций.
- Может содержать текстовый, графический или мультимедийный контент.
- Имеет атрибут name, чтобы идентифицировать выходные данные.
- Часто используется совместно с элементами формы, такими как <input> и <button>.

Тег <param> используется внутри <object> для передачи параметров объекту.

Основные особенности:
- Задает имя и значение параметра с помощью атрибутов name и value.
- Позволяет настраивать поведение и внешний вид встраиваемого объекта.

Тег <picture> позволяет предоставлять браузеру разные версии изображения.

Особенности:
- Внутри <picture> размещаются теги <source> с медиа-запросами.
- Браузер выбирает подходящий вариант изображения.
- Тег <img> используется как резервный вариант.

Тег <pre> сохраняет форматирование текста, включая пробелы, табуляцию, переносы строк.

Особенности:
- Отображает текст в моноширинном шрифте.
- Часто используется для примеров кода.
- Можно комбинировать с другими элементами, например <code>.

<pre aria-label="Изображение кота, собранное из текстовых символов.">
  ../\„„./\.
  .(='•'= ) .
  .(") „. (").
  . \,\„„/,/
  . │„„. „│
  . /„/„ \„\
  .(„)''l l''(„)
  . .. ((...
  . . . ))..
  . . .((..
</pre>

Тег <progress> отображает индикатор прогресса.

Особенности:
- Имеет атрибуты value и max.
- value показывает текущее значение прогресса.
- max указывает максимальное значение.
- Отображается в виде прогрессивной полосы.
- Используется для показа загрузки, выполнения задач и т.д.