The <hr>
HTML 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.
<hr>: The Thematic Break (Horizontal Rule) element
Try it
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
Deprecated -
Sets the alignment of the rule on the page. If no value is specified, the default value is
left
. -
color
Non-Standard -
Sets the color of the rule through color name or hexadecimal value.
-
noshade
Deprecated -
Sets the rule to have no shading.
-
size
Deprecated -
Sets the height, in pixels, of the rule.
-
width
Deprecated -
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 |
---|
HTML Standard # the-hr-element |
Browser compatibility
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
hr |
1
|
12
|
1
|
5.5
|
≤12.1
|
3
|
1
|
18
|
4
|
≤12.1
|
1
|
1.0
|
align |
1
|
12
|
1
|
≤6
|
≤12.1
|
≤4
|
1
|
18
|
4
|
≤12.1
|
≤3
|
1.0
|
color |
33
|
12
|
1
|
≤6
|
20
|
10.1
|
4.4.3
|
33
|
4
|
20
|
10.3
|
2.0
|
noshade |
1
|
12
|
1
|
≤6
|
≤12.1
|
≤4
|
1
|
18
|
4
|
≤12.1
|
≤3
|
1.0
|
size |
1
|
12
|
1
|
≤6
|
≤12.1
|
≤4
|
1
|
18
|
4
|
≤12.1
|
≤3
|
1.0
|
width |
1
|
12
|
1
|
≤6
|
≤12.1
|
≤4
|
1
|
18
|
4
|
≤12.1
|
≤3
|
1.0
|
See also
© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/hr