Creating a Website: The Missing Manual, 3rd Edition

Inline Formatting

As you learned earlier in this chapter, it’s best not to format HTML too heavily. To get maximum control over your pages’ appearance and to more easily update your website’s look later on, you should head straight to style sheets (as described in the next chapter). However, a few basic formatting elements are truly useful. You’re certain to come across them, and you’ll probably want to use them in your own pages. These elements are all inline elements, so you use them inside a block element, like a paragraph, a heading, or a list.

Text Formatting: Italics and Bold

You know the elements for bold (<b>) and italic (<i>) formatting from Chapter 2. They’re staples in the HTML world, letting you quickly format snippets of text. Here’s an example:

<p>
<b>Stop!</b> The mattress label says <i>do not remove under penalty
of law</i> and you <i>don't</i> want to mess with mattress companies.
</p>

A browser displays that HTML like this:

Stop! The mattress label says do not remove under penalty of law and you don’t want to mess with mattress companies.

To make life more interesting, HTML has a second set of elements that appear—at first glance—to do the same things. These are <em> (for emphasized text) and <strong>.

Here’s the previous example rewritten to use the <em> and <strong> elements:

<p>
<strong>Stop!</strong> The mattress label says <em>do not remove under penalty
of law</em> and you <em>don't</em> want to mess with mattress companies.
</p>

Ordinarily, the <em> element italicizes ...