Line break and horizontal rule

Learn when to use and <hr>.

What is the br tag?

The   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   instead of putting each line in a new .

Important:   is a void element. It takes no content; that is why it has no closing tag.  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  , <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.   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   or  . Both are valid; it is a matter of habit. We will use the   form in this course.

Exercise Write an address card

Add an address card to body. In the first , separate Alex Carter and 5 Park Street with  . Then draw an <hr> rule. Finally, open another  and write London.

Show example solution

<body>
  <p>Alex Carter<br>5 Park Street</p>
  <hr>
  <p>London</p>
</body>

Test yourself

Does have a closing tag ()?
- is a void element, it has no closing tag
- must always be written
- Only needs a closing tag
- Only old browsers need a closing tag
Show answer

 is a void element, it has no closing tag — Correct. is a void element; it has no closing tag.

Add a line break

Name: Alex____Surname: Carter

Show answer

Name: Alex<br>Surname: Carter

Match each tag to its role

 

Line break
<hr>

Horizontal rule


Paragraph
<h1>

Main heading

Next lesson: Emphasis and important text

We Are Enhancing Your Experience

Cookie Preferences

Strictly Necessary Cookies

Analytical Cookies