This reference is built into PageRIJ — a live HTML, CSS & SVG authoring and learning environment.

HTML <hr> element

The <hr> element represents a paragraph-level thematic break, such as a scene change in a story or a transition to another topic within a discussion.

Browsers usually display it as a horizontal rule. Its meaning comes from the change in subject or scene, while CSS controls the appearance. A purely decorative line can be supplied by a CSS border without introducing a thematic break.

In the example below, the first <p> describes an evening at the harbour. The paragraph after the <hr> moves to the following morning in another place. The rule marks that change between the two scenes.

The element can also separate sets of <option> elements within a <select> control. In that context it acts as an option separator rather than a break between paragraphs.

The <hr> element is a void element: it has no contents and no closing tag. It stands between the pieces of content it separates.

Attributes: GLOBALS.

Typical layout:
<p>At dusk, the last boat returned to the harbour.</p>
<hr>
<p>The next morning, Anna arrived in the mountain village.</p>
Visual representation:

At dusk, the last boat returned to the harbour.


The next morning, Anna arrived in the mountain village.