In the last section we learned how to change the appearance of text using the <font> tag. We saw how
to change the color, size and font-face of the text.
In this section we'll see how to use other tags to alter the appearance of text.
To make a section of text be displayed as bold text, we need to use the <b> tag. b is short for bold. As usual, the text between the opening and closing tags are affected, e.g. -
To make a section of text appear underlined, we would use the <u> tag, which is short for underlined. Example code -
Underlined text should be avoided where possible, as it can confuse users, who expect the text to be a link.
To make text appear italicized, we use the <i> tag. You can probably guess that i is short for italics, or italicize. Example code -
Another tag in this family is the <s> tag, which is short for strike, or strikethrough. This is rarely used, for obvious reasons. It makes text appear with a line through it,
Two other similar tags, although rarely used, are <sup> and <sub> which stand for superscript and subscript respectively. Superscript text appears like this, and subscript text looks like this. Example code -
Mixing style tags
With all these tags, including the <font> tag which we looked at in an earlier section, you can mix, or nest tags to create different results. If you do this, it's important to nest your tags correctly. For example, let' say we want to have some text appear as both bold and underlined. The correct HTML to achieve this would be either-
or alternatively -
Giving this effect .
So the first tag to be opened is the last one to be closed. An incorrect way to do this would be -
So as long as you are careful to nest your tags correctly, you can mix as many different style tags as you want. For (an extreme!) example -
Gives this effect.
OK, now we're getting somewhere. We've taken a look at the many ways we can change the appearance of text in the page, and how we can structure the page with paragraphs, line breaks and horizontal rules. Now, we'll take a brief look at how to write 'good' HTML, and then learn how to use comments in our code.
|Introduction - The Basics - Moving On - Advanced - Glossary - Reference|