11.10 Turning Arbitrary Content into a Styled Element

NN 4, IE 3

11.10.1 Problem

You want to assign a style to a section of body content that is not currently delimited by HTML tags.

11.10.2 Solution

Wrap the content inside a <span> or <div> tag pair, and assign a style to that element type, class, or ID:

<p>And now for something <span class="hot">completely</span> different.</p>

11.10.3 Discussion

Despite the large number of contextual tags provided by HTML 4.0 (such as the <address> and <blockquote> tags), the tags don't necessarily have names that describe the true context within your document. Although you can use XML capabilities of IE 5 and later for Windows and NN 6 or later to fill this gap (by designing your own tags), you can also use HTML tags to define these contexts for you.

The span element is customarily used to wrap inline content, such as a sequence of text within a paragraph. A div element automatically defines a block-level entity, which means that the browser starts a div element's content on its own line while any content following the div element begins on a new line after the div. A div element is often used when the page needs to change alignment from, say, left to center. But a div is also a convenient container for content that is to be positioned on a page.

11.10.4 See Also

Recipes of Chapter 13 for using a div with CSS positioning; Recipe 15.2 for converting a user selection into an arbitrary element for styling.