ЛУЧШИЙ САЙТ ДЛЯ ВЕБ-РАЗРАБОТЧИКОВ
HTML теги. Полный справочник

HTML тег <hr>


Пример

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

<h1>HTML</h1>
<p>HTML это язык для написания веб-страниц.....</p>

<hr>

<h1>CSS</h1>
<p>CSS определяет, как отображать элементы HTML.....</p>
Попробуйте сами »

Определение и использование

Тег <hr> определяет тематический разрыв на странице HTML (например, смена темы).

Элемент <hr> используется для разделения содержимого (или определения изменения) на странице HTML.


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

Элемент
<hr> Yes Yes Yes Yes Yes

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

В HTML5 тег <hr> определяет тематический перерыв.

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

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

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


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

В HTML тег <hr> не имеет конечного тега.

В XHTML тег <hr> должен быть правильно закрыт, например: <hr />.


Атрибуты

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

Глобальные атрибуты

Тег <hr> также поддерживает Глобальные атрибуты в HTML.


Атрибуты событий

Тег <hr> также поддерживает Атрибуты событий в HTML.


Связанные страницы

HTML DOM справочник: Объект HR


Настройки 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;
}
Попробуйте сами »