ptg16476052

Character Formatting Using CSS 125

7

<sub > Subscript

<sup > Superscript

Character Formatting Using CSS

You’ve already seen how styles can be used to modify the appearance of various ele-
ments. Any of the effects associated with the tags introduced in this lesson can also be
created using CSS. Before I go into these properties, however, I want to talk a bit about
how to use them. As I’ve said before, the style attribute can be used with most tags.
However, most tags somehow affect the appearance of the text that they enclose. There’s
a tag that doesn’t have any inherent effect on the text that it’s wrapped around: the
tag. It exists solely to be associated with style sheets. It’s used exactly like any of
the other tags you’ve seen in this lesson. Simply wrap it around some text, like this:

This is an example of the usage of the span tag.

Used by itself, the tag has absolutely no effect. Paired with the style attribute, it
can take the place of any of the tags you’ve seen in this lesson and can do a lot more than
that, as well.

The Text Decoration Property

The text-decoration property is used to specify which, if any, decoration will
be applied to the text within the affected tag. The valid values for this property are
underline, overline, line-through, and blink. The application of each of them is self-
explana tory. However, here’s an example that demonstrates how to use each of them:

Here is some underlined text
.

Here is some overlined text.

Here is some line-through text
.

Here is some blinking text.

The cool thing is that you can use these styles along with all the other properties you’ll
see i n this lesson with any tag that contains text. Take a look at this example:

An Underlined Heading

Using the style attribute, you can specify how the text of the heading appears. As you
can see, using the style attribute involves a lot more typing than using the tag. The
tradeoff is that there are many other ways to specify styles that are much more efficient