246996016-HTML5-Step-by-Step

Applying Strikethrough and Underlining 115
Most Web designers don’t use underlining as a formatting technique because hyperlinks
are underlined, and it is considered poor design to confuse your users with text that
looks “clickable” but is not. In the example just shown, for instance, you might think that
the text Now only $9.99 is a hyperlink, but it’s not; it’s just underlined.
If you simply want to underline or strike through a few words of text in one specific
instance that probably won’t recur elsewhere on your page (or site), it’s easiest to use
the tag for underlining or the tag for strikethrough. These tag names come
from the logical functions that underlining and strikethrough often serve in an edited
document; insertions are commonly underlined, and deletions are commonly struck
through. Here’s the code for the preceding example:
List price: $24.00 Now only $9.99
Note In early HTML versions, there was a or tag for strikethrough and a tag
for underlining, but both were deprecated in HTML4 and removed completely in HTML5. The
and tags will probably become deprecated at some point, but for now they are still
in use.
To strike through or underline text by using a style (a more modern and “correct”
method, although it requires a little more typing), use the text-decoration attribute. This
attribute accepts several keywords:
●
●
●
●
●
underline
overline (line over the text)
line-through (strikethrough)
blink (flashing text)
none (removes all inherited decoration)
Caution Do not use blinking text if at all possible. It is quite annoying. Visitors to your site will
probably dislike it so much that they will leave your site and never return.
You can use the none keyword to remove the underlining from text that would ordinarily
be underlined automatically, such as a hyperlink. Be careful, though, because if you
remove the underline from a hyperlink, many people will not realize they can click it.
Here are some examples applied to individual paragraphs:
This looks clickable, but isn’t.
This is struck-through.
Congratulations, you win!