HTML Text Tags: Paragraphs, Line Breaks, Bold, and Italic

A word processor formats text with a toolbar. HTML formats text with tags: <p> for a paragraph, <br> for a single line break, and a handful of tags for bold, italic, underline, and strikethrough.

This is the written version of my HTML text formatting and paragraphs videos, part of my HTML beginners course. It's embedded near the top.

Key Takeaways

• <p> wraps a paragraph. Browsers space paragraphs apart from each other automatically.
• <br> forces a single line break inside a block of text, without starting a new paragraph.
• Browsers collapse extra spaces and line breaks in your HTML down to one. Use CSS for layout spacing, not repeated spaces or line breaks.
• <strong> and <em> are the modern tags for bold and italic; they also tell screen readers and search engines the text is important or emphasized, which <b> and <i> don't.
• <u> underlines, <s> strikes through. Nested tags have to close in the reverse order they opened.

Paragraphs

Wrap a block of text in <p> to tell the browser to treat it as a paragraph:

<p>This is the first paragraph.</p>
<p>This is a second, separate paragraph.</p>

Browsers add space above and below each <p>, which is why paragraphs read as visually distinct blocks without you doing anything else.

Line breaks

<br> breaks a single line without starting a new paragraph. It's self-closing, with no separate end tag:

<p>First line.<br>Second line.</p>

Reach for <br> inside something like an address or a poem, where a line genuinely needs to break at a specific point. Don't stack several <br> tags in a row to add vertical space between sections; that's a job for CSS margin or padding instead.

Why extra spaces don't show up

Type five spaces between two words in your HTML and the browser renders exactly one. This is called whitespace collapsing, and it applies to extra spaces, tabs, and line breaks alike; HTML doesn't preserve them the way a text editor does.

An old workaround is the non-breaking space entity,  , which the browser won't collapse:

<p>Left&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Right</p>

That's five non-breaking spaces between "Left" and "Right." It works, but stacking   to fake layout spacing is a workaround from before CSS handled this properly. For real spacing between or inside elements today, use CSS margin and padding instead.   still has a legitimate, narrow use: keeping two words that shouldn't wrap onto separate lines together, like a number and its unit ("10 pixels").

Bold, italic, underline, and strikethrough

Four tags cover the common cases:

<p><strong>This is bold.</strong></p>
<p><em>This is italic.</em></p>
<p><u>This is underlined.</u></p>
<p><s>This has a strikethrough.</s></p>

<strong> and <em> are the modern choices for bold and italic. Older <b> and <i> tags render identically but carry no meaning; <strong> and <em> additionally tell screen readers and search engines that the text is important or emphasized. When the formatting is decorative only, <b>/<i> are fine; when it signals real emphasis, use <strong>/<em>. <s> is the current tag for strikethrough; an older <strike> tag exists but is obsolete, so use <s> in anything you write today.

Combining formatting

Tags nest, and nested tags have to close in the reverse order they opened, innermost first:

<p><strong><u>Bold and underlined</u></strong>, plus <em><s>italic with a strikethrough</s></em>.</p>

Opening <strong> then <u> means the closing tags come back out in the opposite order: </u> first, then </strong>. Get the order backward and some browsers will still render it, but the markup is invalid and can behave unpredictably, especially once CSS or JavaScript starts targeting these elements.

Coloring and fonts belong in CSS

Older HTML included tags and attributes for coloring text and changing fonts directly. They still technically work, but modern development handles all of that in CSS instead. CSS Colors covers the same coloring problem the right way, and Basic CSS Crash Course shows a full page styled that way from scratch. If you're inclined to reach for an inline formatting attribute for color or font, that's your signal to open a stylesheet instead.

Where to go next

Paragraphs and text formatting are the foundation the rest of the course builds on: HTML Headings covers the other major piece of visible text structure.

FAQ

What's the difference between p and br?

<p> wraps a full paragraph and gets automatic spacing above and below it. <br> forces a single line break inside a block of text without starting a new paragraph or adding that extra spacing.

Why don't my extra spaces show up in the browser?

Browsers collapse multiple spaces, tabs, and line breaks in HTML down to a single space. This is standard behavior, not a bug. Use CSS for intentional spacing instead of typing extra spaces.

Should I use strong or b for bold text?

Use <strong> when the text is genuinely important; it carries that meaning to screen readers and search engines. Use <b> only when the bold styling is purely visual with no added meaning. They render identically either way.

Is the strike tag still current?

No. <strike> is obsolete. Use <s> for strikethrough text today.

Can I nest bold, italic, and underline together?

Yes. Wrap one tag inside another, and close them in reverse order: whichever tag you opened last should be the first one you close.