HTML Formatting

Formatting tags change how text looks without changing what it is. The pair you will meet first is b for bold and i for italics. Wrap the text you want to stand out and the browser handles the styling. Simple, fast, and good enough for most writing.

Modern HTML adds a second pair with more weight behind it. The strong tag makes text bold, and the em tag makes it italic, but they also say something about meaning. Screen readers and search engines treat strong and em as emphasis, while b and i are treated as pure decoration. Use strong for warnings and important notes, and em for words the reader should stress.

A few more tags cover special cases. The mark tag highlights text like a yellow marker, the del tag shows removed text with a line through it, and the sub and sup tags position small text below or above the line for formulas and exponents. You will not use them daily, but they are good to know.

The bold pairs: b and strong

You now have two ways to make text bold and two ways to make it italic. Use b and i when you only want the visual style, like a word in a product name. Use strong and em when the emphasis carries meaning, like an important warning or a word the reader should stress.

<p>This is <b>bold</b>, and this is <strong>important</strong>.</p>
<p>This is <i>italic</i>, and this is <em>stressed</em>.</p>

The rest of the set

The other formatting tags cover special cases. Mark highlights text like a marker pen, del shows a line through removed text, and sub and sup position small letters below or above the line for chemical formulas and exponents. The small tag shrinks text for fine print like copyright lines.

<p><mark>Highlighted</mark> and <del>removed</del>.</p>
<p>Water is H<sub>2</sub>O and 10<sup>2</sup> is 100.</p>

Syntax

<p><strong>Important</strong> and <em>stressed</em> words.</p>

<strong>Warning: unsaved</strong> not <b>Warning</b>