The HTML <hr>
element represents a thematic break between paragraph-level elements: for example, a change of scene in a story, or a shift of topic within a section.
The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
Historically, this has been presented as a horizontal rule or line. While it may still be displayed as a horizontal rule in visual browsers, this element is now defined in semantic terms, rather than presentational terms, so if you wish to draw a horizontal line, you should do so using appropriate CSS.
Content categories | Flow content. |
Permitted content | None, it is an empty element. |
Tag omission | It must have start tag, but must not have an end tag. |
Permitted parents | Any element that accepts flow content. |
Implicit ARIA role | separator
|
Permitted ARIA roles | presentation or none
|
DOM interface | HTMLHRElement
|
Attributes
This element's attributes include the global attributes.
align
'- Sets the alignment of the rule on the page. If no value is specified, the default value is
left
. color
'- Sets the color of the rule through color name or hexadecimal value.
noshade
'- Sets the rule to have no shading.
size
'- Sets the height, in pixels, of the rule.
width
'- Sets the length of the rule on the page through a pixel or percentage value.
Example
HTML
<p>
This is the first paragraph of text.
This is the first paragraph of text.
This is the first paragraph of text.
This is the first paragraph of text.
</p>
<hr>
<p>
This is the second paragraph of text.
This is the second paragraph of text.
This is the second paragraph of text.
This is the second paragraph of text.
</p>
Result
Specifications
Specification | Status | Comment |
---|---|---|
HTML Living StandardThe definition of '<hr>' in that specification. | Living Standard | Definition of the <hr> element
|
HTML5The definition of '<hr>' in that specification. | Recommendation | |
HTML 4.01 SpecificationThe definition of '<hr>' in that specification. | Recommendation | The align , noshade , size , and width attributes are deprecated
|
Browser compatibility
The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
hr
|
Chrome
Full support Yes |
Edge
Full support 12 |
Firefox
Full support 1 |
IE
Full support Yes |
Opera
Full support Yes |
Safari
Full support Yes |
WebView Android
Full support Yes |
Chrome Android
Full support Yes |
Firefox Android
Full support 4 |
Opera Android
Full support Yes |
Safari iOS
Full support Yes |
Samsung Internet Android
Full support Yes |
|
Chrome
Full support Yes |
Edge
Full support 12 |
Firefox
Full support 1 |
IE
Full support Yes |
Opera
Full support Yes |
Safari
Full support Yes |
WebView Android
Full support Yes |
Chrome Android
Full support Yes |
Firefox Android
Full support 4 |
Opera Android
Full support Yes |
Safari iOS
Full support Yes |
Samsung Internet Android
Full support Yes |
|
Chrome
Full support Yes |
Edge
Full support 12 |
Firefox
Full support 1 |
IE
Full support Yes |
Opera
Full support Yes |
Safari
Full support Yes |
WebView Android
Full support Yes |
Chrome Android
Full support Yes |
Firefox Android
Full support 4 |
Opera Android
Full support Yes |
Safari iOS
Full support Yes |
Samsung Internet Android
Full support Yes |
|
Chrome
Full support Yes |
Edge
Full support 12 |
Firefox
Full support 1 |
IE
Full support Yes |
Opera
Full support Yes |
Safari
Full support Yes |
WebView Android
Full support Yes |
Chrome Android
Full support Yes |
Firefox Android
Full support 4 |
Opera Android
Full support Yes |
Safari iOS
Full support Yes |
Samsung Internet Android
Full support Yes |
|
Chrome
Full support Yes |
Edge
Full support 12 |
Firefox
Full support 1 |
IE
Full support Yes |
Opera
Full support Yes |
Safari
Full support Yes |
WebView Android
Full support Yes |
Chrome Android
Full support Yes |
Firefox Android
Full support 4 |
Opera Android
Full support Yes |
Safari iOS
Full support Yes |
Samsung Internet Android
Full support Yes |
|
Chrome
Full support Yes |
Edge
Full support 12 |
Firefox
Full support 1 |
IE
Full support Yes |
Opera
Full support Yes |
Safari
Full support Yes |
WebView Android
Full support Yes |
Chrome Android
Full support Yes |
Firefox Android
Full support 4 |
Opera Android
Full support Yes |
Safari iOS
Full support Yes |
Samsung Internet Android
Full support Yes |
Legend
- Full support
- Full support
- Non-standard. Expect poor cross-browser support.'
- Non-standard. Expect poor cross-browser support.
- Deprecated. Not for use in new websites.'
- Deprecated. Not for use in new websites.
See also
<hr>: The Thematic Break (Horizontal Rule) element by Mozilla Contributors is licensed under CC-BY-SA 2.5.