Definition
The <hr>
element represents a paragraph-level thematic break. This could be a scene change in a story or transition to another topic within a section of a reference book.
Example
<p>The first rule of marketing is to make yourself known.
People tend to do business with those they trust.</p>
<hr>
<p>The second rule of marketing is to take your competition seriously.
The public has many different options for the same product. That freedom must
be respected, and as such, you must make an effort to stand out.</p>
Usage
- The
<hr>
element does not affect the document’s outline. - The
<hr>
element does not have a closing tag. - The default styling for the
<hr>
element is a horizontal rule. You can style this using CSS.
Attributes
The <hr>
element only supports the Global Attributes.
Best Practices
- There is no need for an
<hr>
element between the<section>
elements. The<section>
elements already imply a thematic change. - The
<hr>
tags are often abused or misunderstood. They are often used when templating the structure of a page or as design elements. This is wrong.
Specification
Browser Support
Desktop
Chrome | Edge | Firefox | IE | Opera | Safari |
---|---|---|---|---|---|
Yes | Yes | Yes | Yes | Yes | Yes |
Mobile
Android Webview | Chrome Android | Firefox Android | Opera Android | iOS Safari | Samsung Internet |
---|---|---|---|---|---|
Yes | Yes | Yes | Yes | Yes | Yes |