<hr> – Елемент тематичного розриву (горизонтальна лінія)

Елемент HTML <hr> (horizontal rule - горизонтальна лінія) служить для розділення елементів рівня абзацу: наприклад, коли змінюється сцена в історії, чи тема всередині розділу.

Спробуйте його в дії

Історично цей елемент зображався як горизонтальна лінійка чи лінія. Позаяк він все ще може мати вигляд горизонтальної лінії у візуальних браузерах, цей елемент тепер має більше семантичний зміст, аніж візуальний. Отже, якщо потрібно просто провести горизонтальну лінію, слід робити це за допомогою відповідного CSS.

Атрибути

Серед атрибутів цього елемента присутні глобальні атрибути.

align

Задає шикування лінії на сторінці. Якщо значення не задано, то усталеним значенням є left.

color

Задає колір лінії за допомогою назви кольору або шістнадцяткового значення.

noshade

Задає лінії відсутність тіні.

size

Задає висоту лінії в пікселях.

width

Задає довжину лінії на сторінці, за допомогою значення в пікселях або відсотках.

Приклад

HTML

<p>
  Це перший абзац тексту. Це перший абзац тексту. Це перший абзац тексту. Це
  перший абзац тексту.
</p>

<hr />

<p>
  Це другий абзац тексту. Це другий абзац тексту. Це другий абзац тексту. Це
  другий абзац тексту.
</p>

Результат

Технічний підсумок

Категорії вмісту Потоковий вміст.
Дозволений вміст Жодного; це пустий елемент.
Пропуск тега Повинен мати початковий тег і не мати кінцевого.
Дозволені батьківські елементи
Неявна роль ARIA separator
Дозволені ролі ARIA presentation або жодної ролі
Інтерфейс DOM HTMLHRElement

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

Сумісність із браузерами

desktop mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on iOS Samsung Internet
hr
Chrome Full support 1
Edge Full support 12
Firefox Full support 1
Internet Explorer Full support 5.5
Opera Full support 12.1
Safari Full support 3
WebView Android Full support 1
Chrome Android Full support 18
Firefox for Android Full support 4
Opera Android Full support 12.1
Safari on iOS Full support 1
Samsung Internet Full support 1.0
align
Нерекомендоване Нестандартне
Chrome Full support 1
Edge Full support 12
Firefox Full support 1
Internet Explorer Full support 6
Opera Full support 12.1
Safari Full support 4
WebView Android Full support 1
Chrome Android Full support 18
Firefox for Android Full support 4
Opera Android Full support 12.1
Safari on iOS Full support 3
Samsung Internet Full support 1.0
color
Нерекомендоване Нестандартне
Chrome Full support 33
Edge Full support 12
Firefox Full support 1
Internet Explorer Full support 6
Opera Full support 20
Safari Full support 10.1
WebView Android Full support 4.4.3
Chrome Android Full support 33
Firefox for Android Full support 4
Opera Android Full support 20
Safari on iOS Full support 10.3
Samsung Internet Full support 2.0
noshade
Нерекомендоване Нестандартне
Chrome Full support 1
Edge Full support 12
Firefox Full support 1
Internet Explorer Full support 6
Opera Full support 12.1
Safari Full support 4
WebView Android Full support 1
Chrome Android Full support 18
Firefox for Android Full support 4
Opera Android Full support 12.1
Safari on iOS Full support 3
Samsung Internet Full support 1.0
size
Нерекомендоване Нестандартне
Chrome Full support 1
Edge Full support 12
Firefox Full support 1
Internet Explorer Full support 6
Opera Full support 12.1
Safari Full support 4
WebView Android Full support 1
Chrome Android Full support 18
Firefox for Android Full support 4
Opera Android Full support 12.1
Safari on iOS Full support 3
Samsung Internet Full support 1.0
width
Нерекомендоване Нестандартне
Chrome Full support 1
Edge Full support 12
Firefox Full support 1
Internet Explorer Full support 6
Opera Full support 12.1
Safari Full support 4
WebView Android Full support 1
Chrome Android Full support 18
Firefox for Android Full support 4
Opera Android Full support 12.1
Safari on iOS Full support 3
Samsung Internet Full support 1.0

Дивіться також