Paragraphs and Line Breaks

Paragraphs are the building blocks of text content. Understanding how HTML handles whitespace and line breaks is essential for formatting text properly.

The Paragraph Element

The <p> element:

• Creates a block of text
• Automatically adds spacing above and below
• Used for any body text content

HTML Ignores Extra Whitespace

HTML treats multiple spaces and line breaks as a single space. This is called whitespace collapsing.

Line Breaks

To force a line break within a paragraph, use <br>:

When to use <br>:

• Poetry or song lyrics
• Addresses
• Content where line breaks are meaningful

Note: Don't use <br> for spacing between paragraphs - use multiple <p> elements instead.

Horizontal Rules

The <hr> element creates a thematic break between content:

Use <hr> to indicate:

• Scene changes in stories
• Topic shifts in articles
• Section breaks

Preformatted Text

The <pre> element preserves whitespace and line breaks:

Use <pre> for:

• Code snippets
• ASCII art
• Text where spacing matters

Combining with Code

The <code> element marks inline code:

Exercise: Format a Poem

Create a properly formatted poem with title, author, and verses:

Understanding how HTML handles text and whitespace is fundamental to creating well-formatted content!