Line break and horizontal rule
Learn when to use <br> and <hr>.
What is the br tag?
The <br> tag (line break) creates a line break in the text — it moves the next piece to a new line. Use it when you want a new line inside a paragraph. For example, when writing an address or a poem you separate lines with <br> instead of putting each line in a new <p>.
Important: <br> is a void element. It takes no content; that is why it has no closing tag. </br> is not written.
What is the hr tag?
The <hr> tag (horizontal rule) draws a horizontal line on the page. Its real job is to mark a change of topic — for example to separate one section from the next.
Like <br>, <hr> is also a void element. It has no closing tag and takes no content. It is used only as a divider. Its visual style can be changed with CSS.
What is a void element?
A void element is one that takes no content and has no closing tag. <br> and <hr> are examples. The opening tag is enough on its own — you do not write anything after it.
In HTML5 you can write void elements as <br> or <br/>. Both are valid; it is a matter of habit. We will use the <br> form in this course.
Exercise Write an address card
Add an address card to body. In the first <p>, separate Alex Carter and 5 Park Street with <br>. Then draw an <hr> rule. Finally, open another <p> and write London.
Show example solution
<body>
<p>Alex Carter<br>5 Park Street</p>
<hr>
<p>London</p>
</body>
Test yourself
-
Does <br> have a closing tag (</br>)?
- <br> is a void element, it has no closing tag
- </br> must always be written
- Only <br/> needs a closing tag
- Only old browsers need a closing tag
Show answer
<br> is a void element, it has no closing tag — Correct. <br> is a void element; it has no closing tag.
-
Add a line break
Name: Alex____Surname: CarterShow answer
Name: Alex<br>Surname: Carter -
Match each tag to its role
- <br>
- Line break
- <hr>
- Horizontal rule
- <p>
- Paragraph
- <h1>
- Main heading