HTML - тег <hr> — это элемент уровня блока, переносящий все элементы после него в другую строку. Внешний вид горизонтальной линии, определяемой тегом, зависит от типа браузера. Чаще всего отображается с рамкой, создающей 3D-эффект.
Тег <hr> - синтаксис и код
<hr> — пустой тег, что означает, что закрывающий тег не требуется, в отличие от XHTML, где тег (<hr>) должен закрываться <hr />.
Пример разметки тега <hr> для определения тематических изменений в контенте:
<h1>Основные языки Интернета</h1>
<p>HTML ( The HyperText Markup Language) — это стандартный язык разметки для создания веб-страниц.
С HTML вы можете создать свой собственный веб-сайт, для любых целей.</p>
<hr>
<p>CSS - "Cascading Style Sheets" что в переводе означает каскадные таблицы стилей.
CSS может управлять макетом нескольких веб-страниц одновременно.</p>
<hr>
<p>JavaScript — самый популярный в мире язык программирования.
JavaScript делает HTML-страницы более динамичными и интерактивными.</p>
Определение и использование
- Тег
<hr> определяет тематический разрыв на HTML-странице (например, смену темы);
- Элемент
hr чаще всего отображается как горизонтальная линия, которая используется для разделения содержимого (или определения изменения) на HTML-странице.
★
Примечание: в
HTML5 тег
<hr> определяет тематическое изменение между элементами уровня абзаца на HTML-странице. В предыдущих версиях HTML он использовался для рисования на странице горизонтальной линии, визуально разделяющей контент. В HTML5 он имеет семантическое значение.
Поддержка <hr> браузерами
 |
✅ Поддерживает |
 |
✅ Поддерживает |
 |
✅ Поддерживает |
 |
✅ Поддерживает |
 |
✅ Поддерживает |
Атрибуты
Глобальные атрибуты
Тег <hr> также поддерживает глобальные атрибуты в HTML
Атрибуты событий
Тег <hr> также поддерживает атрибуты событий в HTML
Дополнительные примеры
Выравнивание элемента hr (с помощью CSS):
<hr style="width:50%;text-align:left;margin-left:0">
Затененный hr (с помощью CSS):
<hr style="height:2px;border-width:0;color:gray;background-color:gray">
Установите высоту элемента hr (с помощью CSS):
Установите ширину элемента hr (с помощью CSS):
ПРИМЕР
Связанные страницы
Руководство по HTML: HTML параграфы
Настройки CSS по умолчанию
Большинство браузеров отображают элемент hr со следующими значениями по умолчанию:
hr {
display: block;
margin-top: 0.5em;
margin-bottom: 0.5em;
margin-left: auto;
margin-right: auto;
border-style: inset;
border-width: 1px;
}
Полный список всех доступных тегов HTML см. в Справочнике по тегам HTML.
