HTML тег <hr>

Элемент <hr> (от англ. "horizontal rule" ‒ «горизонтальная линия») определяет тематический разрыв контента на HTML странице (например, изменение темы). Также, элемент <hr> может использоваться для визуального разделения контента на странице.

Так как этот тег является блочным — он создает перенос строк перед собой и после себя, а также небольшие поля (margin) сверху и снизу. Внешний вид линии и размер полей зависит от типа браузера, как правило они отображают ее с рамкой, которая создает эффект трехмерности.

Синтаксис

<hr>

Закрывающий тег

Не требуется.

Атрибуты

alignУстарел в HTML5
Устанавливает горизонтальное выравнивание линии.
colorНестандартный
Цвет линии.
noshadeУстарел в HTML5
Рисует линию без трёхмерных эффектов.
sizeУстарел в HTML5
Толщина линии.
widthУстарел в HTML5
Ширина линии.

Для этого элемента доступны глобальные атрибуты и события.

Стилизация по умолчанию

Большинство браузеров отобразит элемент <hr> со следующими значениями CSS по умолчанию:

hr { 
    display: block;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    margin-left: auto;
    margin-right: auto;
    border-style: inset;
    border-width: 1px;
}

Различия между HTML 4.01 и HTML5

В HTML 4.01 тег <hr> представляет горизонтальную линию.

В HTML5 тег <hr> определяет тематический разрыв. Тем не менее, тег <hr> в визуальных браузерах все еще может отображаться как горизонтальная линия, однако в настоящее время он определяется в семантическом, а не презентативном смысле.

В HTML5 все стилевые атрибуты были удалены. Вместо них следует использовать стили CSS.

Пример использования:

Элемент <hr>.

Используем тег <hr> для тематического разделения контента:

Пример HTML:

Попробуй сам
<h1>HTML</h1>
<p>HTML – язык описания веб-страниц.</p>
<hr>
<h1>CSS</h1>
<p>CSS — определяет то, как будут отображаться HTML элементы.</p>

Спецификации

Спецификация Статус
WHATWG HTML Living Standard (WHATWG) Живой стандарт
HTML 4.01 (W3C) Рекомендация
HTML5 (W3C) Рекомендация
HTML 5.1 (W3C) Рекомендация

Поддержка браузерами

Похожие страницы

HTML уроки: HTML Элементы

HTML Базовые теги



Contema