Тег hr в HTML: что это такое?

Дата последнего обновления статьи: 2025-01-01

BODYTABLEFOOTERBUTTONBRHEADERDIVSECTIONIMGSPANARTICLEBODYTABLEFOOTERBUTTONBRHEADERDIVSECTIONIMGSPANARTICLEBODYTABLEFOOTERBUTTONBRHEADERDIVSECTIONIMGSPANARTICLEBODYTABLEFOOTERBUTTONBRHEADERDIVSECTIONIMGSPANARTICLEBODYTABLEFOOTERBUTTONBRHEADERDIVSECTIONIMGSPANARTICLEBODYTABLEFOOTERBUTTONBRHEADERDIVSECTIONIMGSPANARTICLEBODYTABLEFOOTERBUTTONBRHEADERDIVSECTIONIMGSPANARTICLEBODYTABLEFOOTERBUTTONBRHEADERDIVSECTIONIMGSPANARTICLE<hr>

Это изображениелицензировано подCC BY 4.0

Тег hr (horizontal rule) в HTML используется для создания горизонтальной линии, которая визуально разделяет содержимое страницы. Этот тег также обозначает тематический разрыв в содержании документа, что делает его полезным не только для визуального оформления, но и для семантической структуры документа.

Синтаксис тега hr

Тег hr является пустым элементом и не требует закрывающего тега:

<hr>

Атрибуты тега hr

В HTML5 тег hr поддерживает только глобальные атрибуты. Устаревшие атрибуты align, noshade, size и width больше не рекомендуются к использованию - вместо них следует использовать CSS.

Примеры использования тега hr

Простой пример

<p>Первый параграф текста</p>
<hr>
<p>Второй параграф текста</p>

Стилизованная линия

<hr style="
  height: 2px;
  background-color: #333;
  border: none;
">

Пунктирная линия

<hr style="
  border: none;
  border-top: 3px dashed #bbb;
  margin: 15px 0;
">

Советы по использованию тега hr

Используйте hr для обозначения смысловых разрывов в контенте, а не только для декоративных целей.
Применяйте CSS для стилизации hr вместо устаревших HTML-атрибутов.
Не злоупотребляйте использованием hr - частое применение может сделать страницу визуально перегруженной.
Учитывайте, что hr имеет семантическое значение и может использоваться скринридерами.
При необходимости можно скрыть визуальное отображение hr с помощью CSS, сохранив его семантическое значение.

Часто задаваемые вопросы (FAQ)

1 Можно ли стилизовать hr с помощью CSS?

Да, тег hr можно стилизовать с помощью CSS. Можно изменять его цвет, толщину, тип линии и другие свойства.

2 Нужен ли закрывающий тег для hr?

Нет, hr является пустым элементом и не требует закрывающего тега.

3 Какая разница между hr и br?

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

Заключение

Тег hr является простым, но полезным элементом HTML, который помогает как визуально, так и семантически структурировать содержимое веб-страницы. При правильном использовании он может улучшить читаемость и доступность вашего контента.

Для получения дополнительной информации о теге hr, рекомендуем ознакомиться с официальной документацией на MDN.

Предыдущая страница

Следующая страница