HTML <hr>
Published Sep 14, 2022Updated Apr 4, 2023
Contribute to Docs
The <hr> (or horizontal rule) element represents a semantic line break between text elements (e.g., a topic-change within a section).
Note: While the
<hr>element was originally created for visual purposes, it is now used for semantic distinction. Styling with CSS is now recommended for creating a horizontal line for presentational purposes.
Syntax
<hr />
The <hr> element is self-closing and the forward slash / is optional. This should be used to semantically separate other elements (e.g., a topic-change within a section).
Example
In the following example, the <hr> element provides a semantic break between the text of two <p> elements:
<p>This is a paragraph.</p><hr /><p>This is a different paragraph.</p>
Contribute to Docs
- Learn more about how to get involved.
- Edit this page on GitHub to fix an error or make an improvement.
- Submit feedback to let us know how we can improve Docs.
Learn HTML on Codecademy
- Front-end engineers work closely with designers to make websites beautiful, functional, and fast.
- Includes 34 Courses
- With Professional Certification
- Beginner Friendly.115 hours
- Start at the beginning by learning HTML basics — an important foundation for building and editing web pages.
- Beginner Friendly.7 hours