HTML тег `<hr>`

Значение и применение

Элемент <hr> обозначает тематический разрыв: например, переход к другой сцене рассказа или другой теме. Обычно браузер рисует горизонтальную линию, но смысл элемента не зависит от оформления. Для чисто декоративной линии используйте CSS-границу. Это пустой элемент без закрывающего тега.

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

Спецификация: multipage

Поддерживается во всех основных браузерах с 2015 года.

Отдельные значения (1) поддерживаются не везде — смотрите таблицу.

ВсеКомпьютерыМобильные

Совместимостьhtml.elements.hr
Возможность	Компьютеры					Мобильные
Возможность	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari on iOS	Samsung Browser	WebView Android	WebView on iOS
`hr`	✓1	✓12	✓1	✓≤12.1	✓3	✓18	✓4	✓≤12.1	✓1	✓1.0	✓4.4	✓1
`align`	✓1	✓12	✓1	✓≤12.1	✓≤4	✓18	✓4	✓≤12.1	✓≤3.2	✓1.0	✓4.4	✓≤3.2
`color`	✓33	✓12	✓1	✓20	✓10.1	✓33	✓4	✓20	✓10.3	✓2.0	✓4.4.3	✓10.3
<hr> in <select>	✓119	✓119	✓122	✓105	✓17	×	✓145	×	✓17.4	×	×	✓17.4
`noshade`	✓1	✓12	✓1	✓≤12.1	✓≤4	✓18	✓4	✓≤12.1	✓≤3.2	✓1.0	✓4.4	✓≤3.2
`size`	✓1	✓12	✓1	✓≤12.1	✓≤4	✓18	✓4	✓≤12.1	✓≤3.2	✓1.0	✓4.4	✓≤3.2
`width`	✓1	✓12	✓1	✓≤12.1	✓≤4	✓18	✓4	✓≤12.1	✓≤3.2	✓1.0	✓4.4	✓≤3.2
Ещё 5 значений · поддерживаются везде более 3 летСвернуть

поддерживаетсяс ограниченияминет поддержкинет данных≤31 — не позднее версии 31

Атрибуты

Атрибут	Значение	Описание
`align`	`left center right`	Не поддерживается в HTML5. Определяет выравнивание элемента. Используйте CSS вместо данного атрибута (значения по умолчаию внизу страницы).
`noshade`	`noshade`	Не поддерживается в HTML5. Указывает, что горизонтальная линия должна отображаться в одном цвете, вместо затененного цвета. Используйте CSS вместо данного атрибута (значения по умолчаию внизу страницы).
`size`	`pixels`	Не поддерживается в HTML5. Определяет высоту элемента. Используйте CSS вместо данного атрибута (значения по умолчаию внизу страницы).
`width`	`pixels %`	Не поддерживается в HTML5. Определяет ширину элемента. Используйте CSS вместо данного атрибута (значения по умолчаию внизу страницы).

Пример, попробуйте сами

Смена темы

Переместите hr между другими абзацами. Он отмечает тематический переход.

index.html

HTML

<section>
  <h2>Утро</h2>
  <p>Мы подготовили план работы.</p>
  <hr />
  <h2>Вечер</h2>
  <p>Настало время обсудить результаты.</p>
</section>

Отличия HTML 4.01 от HTML 5

В HTML5 элемент <hr> определяет тематический разрыв, а в HTML 4.01 представляет собой горизонтальную линию. Ранее используемые атрибуты удалены в HTML5, вместо них используйте CSS .

Значение CSS по умолчанию

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 тег <hr>