Emphasizing text in XHTML

There are number of ways of emphasizing text in XHTML. The exact steps involved in applying text formatting instructions in XHTML is very similar to as it is done HTML. We can, for example, use the <b> tag to make the text bold in both XHTML and HTML. As you may already know <b> is a character-level formatting tag meaning it must be placed inside a paragraph tag (<p>), heading level tag (<h1>, <h2>..., or <h6>), listing tag (<li>), or other block level tag. Table 1 lists some of the mostly common used character-level formatting tags.

Table 1 block-level character-formatting tags
<b> Specifies boldface font
<cite> Specifies citation content
<code> Indicates program code
<em> Adds emphasis to text. This usually renders the text in italics.
<i> Italicizes text
<strong> Specifies strong emphasis (renders as bold)
<sub> Renders text as subscript
<sup> Renders text as superscript

See table 2 for output of the use of each of the character-level tags shown above.

Table 2 character-formatting tags in use
Tag XHTML Markup Output
<b> This is in <bold> This is in
<cite> Reference: <cite>scriptingmaster.com, accessed Apr 2002.</cite> Reference: scriptingmaster.com, accessed Apr 2002.
<code> <code>var x = 8 + 5 * 9;</code> var x = 8 + 5 * 9;
<em> <em>Super</em> fast Super fast
<i> This is a <i>test</i> This is a test
<strong> This redenders as <strong>strong</strong> This redenders as strong
<sub> This is sub<sub>script</sub> This is subscript
<sup> This is super<sup>script</sup> This is superscript

When using these character-level tags keep in mind they must be placed inside block-level elements. You can not place a block-level element inside of a character level tag. Consider the following as an example:

Incorrect: <b><p>A sample small paragraph text.</p></b>
Correct: <p><b>A sample small paragraph text.</b></p>

With character formatting tags, you can emphasize individual letters or words. Avoid use of more than one character formatting tag around a particular block of text:

Italicizing text is <em><em><em>easy</em></em></em>. This is not making the output any extra italic.


Italicizing text is easy. This is not making the output any extra italic.