Тег <hr>

Синтаксис

<hr>

Описание

Тег <hr> (от англ. horizontal rule — горизонтальная линейка) выводит горизонтальную линию, которая по своему виду зависит от используемых параметров, а также браузера.

Элемент относится к блочным тегам, линия всегда начинается с новой строки, а другие элементы после неё отображаются на следующей строке.

Тег <hr> не нужно закрывать.

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

Атрибуты

Атрибут Значение Описание
align left
center
right

Задает горизонтальное выравнивание линии.
Не поддерживается в HTML5
noshade noshade Определяет, что линия будет изображаться без трехмерных эффектов.
Не поддерживается в HTML5
size px Устанавливает толщину линии.
Не поддерживается в HTML5
width px
%		 Устанавливает ширину линии.
Не поддерживается в HTML5

Пример

HTML-код:

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <title>Тег hr</title>
</head>
<body>
    <p>Программирование и вычислительное мышление помогают детям учиться сетевым взаимоотношениям: общаться в чатах,
        видеоконференциях, соцсетях. Решая сложные задачи, дети используют четыре основных компонента вычислительного
        мышления: декомпозицию, выделение паттернов, автоматизацию и абстрагирование.
    </p>
    <hr>
    <p>Обучать детей программированию нужно не для того, чтобы они в будущем стали программистами. Задача
        программирования — подготовить детей к вычислительному мышлению, которое поможет им уверенно справляться с
        комплексными задачами XXI века, которые не имеют однозначного решения.
    </p>
</body>
</html>

Отображение в браузере:

Программирование и вычислительное мышление помогают детям учиться сетевым взаимоотношениям: общаться в чатах,

видеоконференциях, соцсетях. Решая сложные задачи, дети используют четыре основных компонента вычислительного

мышления: декомпозицию, выделение паттернов, автоматизацию и абстрагирование.

Обучать детей программированию нужно не для того, чтобы они в будущем стали программистами. Задача

программирования — подготовить детей к вычислительному мышлению, которое поможет им уверенно справляться с

комплексными задачами XXI века, которые не имеют однозначного решения.

Параметры CSS по умолчанию

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

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

Элемент

Chrome

Chrome

Opera

Opera

Firefox

Firefox

Safari

Safari

Microsoft Edge

Microsoft Edge
<hr> Да Да Да Да Да