Тег <hgroup>: заголовок с подзаголовком
Hgroup объединяет один заголовок с дополнительным текстом, например подзаголовком или поясняющей строкой. Он помогает не размечать каждую строку титульного блока как самостоятельный раздел.
Назначение
Hgroup объединяет один заголовок с дополнительным текстом, например подзаголовком или поясняющей строкой. Он помогает не размечать каждую строку титульного блока как самостоятельный раздел.
Как это работает
Используйте один элемент h1–h6 и связанные абзацы p. Уровень заголовка выбирайте по структуре целого документа. Оформление дополнительных строк задавайте CSS, сохраняя их обычным текстом.
Пример
<hgroup><h2>Работа с массивами</h2><p>Короткий практический раздел для начинающих.</p></hgroup>
<p>Начните с добавления и удаления элементов.</p>Что должно получиться
Название раздела остаётся одним заголовком, а уточнение не создаёт ложный вложенный раздел. После группы идёт обычное основное объяснение.
Граница применения и частая ошибка
Не помещайте в hgroup набор несвязанных заголовков вместо нормальной иерархии страницы. Сам элемент не исправляет пропущенные уровни. Если нужно объединить также дату, автора и навигацию, рассмотрите подходящий header, не сводя все метаданные к подзаголовку.
Самостоятельная проверка
Посмотрите список заголовков документа и убедитесь, что пояснение не попало туда как отдельный раздел. Затем замените подзаголовок длинной строкой и проверьте перенос. Сравните hgroup с простым заголовком и абзацем в контексте статьи.
HTML и CSS можно изменить в песочнице ниже. Она изолирована: JavaScript, внешние ресурсы и отправка форм отключены. Проверки печати, загрузки файлов и сетевых ответов выполняйте в отдельном учебном проекте.