untitled

(John Hannent) #1

Decorating Text with Underlining and Strikethrough ............................


For some reason, those-who-know-best (also known as the CSS specification
committees) sometimes choose weird terminology. Decorationisn’t a very
good word for underlining and similar text effects. The text-decoration
property doesn’t actually refer to decorating the text, which suggests adding
special ornamental designs like monks used to do in medieval times. Rather,
this property governs underlining, overlining, strikethrough, and a bizarre
effect called blinking.

The CSS overlords, in their wisdom, also went a bit whacko when they
decided not to call one of the values strikethroughlike everyone else does.
Instead, they thought it might be fun to add a little confusion and call that
style line-through. Get used to it.

Overlining (a line drawn above the text) can be used for a visual effect, or as
a way of separating zones of text. Fortunately, IE in its wisdom, doesn’t sup-
port the blinking text trick, which to most readers would be a thoroughly
annoying distraction.

Underlining, overlining, and strikethrough (see Figure 5-10) are straightforward:

<html>
<head>

<style>

h1.over {text-decoration: overline;}
h1.under {text-decoration: underline;}
h1.strike {text-decoration: line-through;}

</style>
</head>
<body>

<h1 class=”over”>This is an overline.</h1>

<h1 class=”under”>This is an underline.</h1>

<h1 class=”strike”>This is a strikethrough.</h1>

</body>
</html>

Chapter 5: All About Text 103

Free download pdf