HTML · Module 03 · Lesson 11 of 54

Paragraphs, Line Breaks & Rules

What are Paragraphs & Breaks?

Think of writing an essay on a typewriter. When you finish a thought, you start a new paragraph (which adds a blank space below it). If you want to start a new line immediately without that blank space, you push the carriage return handle (a line break). If you want to divide two sections of the essay, you draw a horizontal line across the paper (a horizontal rule).

In HTML:

: Wraps a block of text into a paragraph. The browser automatically adds some vertical space (margin) before and after it.

 : Forces a line break, moving the text following it to the next line immediately. It is self-closing and does not need a closing tag.

<hr>: Renders a horizontal line (rule) to separate content visually. It is also self-closing.

Why does it matter?

Breaking your text into logical paragraphs and sections makes it readable. If you put all your text into one giant block, visitors will leave your site. Using <hr> and   lets you control text layout and visual rhythm.

How to write it

Here is how you write paragraph blocks and separators:

<p>This is paragraph one.</p>
<hr>
<p>This is paragraph two.<br>It has a line break inside it.</p>

Paragraph Block 1

Paragraph Block 2

Common Mistakes

Using   to create spacing: Don't stack multiple   tags to push content down the page. Use CSS margins instead!   should only be used for actual line breaks (like in a poem or an address).

Writing closing tags for   or <hr>: Tags like   and <hr> are self-closing. Writing  or </hr> is invalid HTML.

Quick Reference

 — Defines a paragraph block.

  — Inserts a single line break.

<hr> — Inserts a thematic horizontal dividing line.

Your Task

Create a paragraph `` containing 'Line 1' followed by a line break ` ` and 'Line 2'. Below that paragraph, place a horizontal rule `<hr>`.

index.html

Type code above to start the lesson.

Live Preview