How to Format Text
I'll admit right here at the start of this task that I'm not going to show you a step-by-step process for adding every formatting option available in HTML. Instead, I'll discuss a few of the most common formatting options. After you've learned how to incorporate these, you'll know how to use the others as well. Specifically, this task shows you how to create bold and italic text and how to underline your text. Step 4 lists some additional formatting options that work essentially the same way as these three common ones.
Let's Get Physical...or Logical
The tags discussed in this task are either physical or logical. Logical tags tell the browser of your intended use for the text, but leave it to the browser to decide how to display it. For instance, the <em> tag tells the browser that you're using this text for emphasis. Most browsers translate this to italics, but you can't count on that treatment from all browsers. On the other hand, the <i> tag (a physical tag) tells the browser specifically, "make this text italic." My suggestion is, if you want italics, use <i>. It's the only way you can be sure that everyone sees italics.
Here are other logical tags: <strong>, <code>, <samp>, <kbd>, <var>, <dfn>, <cite>, <abbr>, and <acronym>. Other physical tags are <b>, <tt>, <u>, <s>, <big>, <small>, <sub>, and <sup>.
Create Bold Text
Create Italic Text
Create Underline and Strikethrough Text
Create Superscript and Subscript Text
You can create bold text on your page by specifying a bold-faced font in the face attribute of the <font> tag. For example, instead of choosing Helvetica as your font, choose Helvetica Bold. Another way is to use either the strong (<strong>...</strong>) or bold (<b>...</b>) tag pairs. The strong tag is a logical tag; the bold tag is a physical tag.
<body> <font size="2" face="arial, helvetica"> In this example, I use the now familiar font tag pair. Within this pair, I use the bold tag pair to make <b>bold text</b> and the strong tag pair to make <strong>strong text</strong>. In most browsers the two tag pairs bring similar results.</font> </body>
To create italic text, use either the emphasis tag pair (logical) or the italic tag pair (physical). Type either <em>...</em> or <i>...</i>. To create bold and italic text, you can type <b><i>...</i></b>. Notice the proper nesting of these tags: Because the italic tag is opened after the bold tag, it is closed before the bold tag. Remember that proper nesting, although important in HTML, is critical in XHTML.
<body> <font size="2" face="arial, helvetica"> In this example, I use font tag pair. Within this pair, I use the italic tag pair to make <i>italic text</i>, and the emphasis tag pair to make <em>emphazised text</em>. In most browsers, the two tag pairs bring similar results. I also nested the italic tag pair within the bold tag pair to make <b><i>bold-italic text</i></b>. </font> </body>
To underline your text, use the underline tag. Type <u>...</u>. To strike through (or cross out) your text, use the strikethrough tag. Type <s>...</s>.
<body> <font size="2" face="arial, helvetica"> Here I use the underline tag to <u>underline a few words</u>, and the strikethrough tag to <s>cross a few words out</s>.</font> </body>
Superscript text is smaller than regular text and is raised off the baseline. The 2 in 32 is written in superscript. To create superscript, use the superscript tag pair. Type <sup>...</sup>. Subscript text is smaller than regular text and is lowered below the baseline. The n in Xn is subscript. To create subscript, use the subscript tag pair. Type <sub>...</sub>.
<body> <font size="2" face="arial, helvetica"> I want to indicate that there is a footnote to this sentence. To do so, I use the superscript tag pair to type my footnote reference,like this<sup>4</sup>. To write 10 base 4, I use the subscript tag pair like this: 10<sub>4</sub>. Then I continue on as normal.</font> </body>