HTML5 and CSS3 All-in-One For Dummies
Book image
Explore Book Buy On Amazon

Text-decoration can be used to add a couple other interesting formats to your HTML5 and CSS3 web page text, including underline, strikethrough, overline, and blink. For example, the following code produces an underlined paragraph:

<!DOCTYPE html>
<html lang = "en-US">
 <head>
 <meta charset = "UTF-8">
 <title>underline.html</title>
 <style type = "text/css">
  p {
  text-decoration: underline;
  }
 </style>
 </head>
 <body>
 <h1>Underline</h1>
 <p>
  This paragraph is underlined.
 </p>
 </body>
</html>

Be careful using underline in web pages. Users have been trained that underlined text is a link, so they may click your underlined text expecting it to take them somewhere.

The underline.html code produces a page similar to this one.

image0.jpg

You can also use text-decoration for other effects, such as strikethrough (called "line-through" in CSS), as shown in the following code:

<!DOCTYPE html>
<html lang = "en-US">
 <head>
 <meta charset = "UTF-8">
 <title>strikethrough.html</title>
 <style type = "text/css">
  p {
  text-decoration: line-through;
  }
 </style>
 </head>
 <body>
 <h1>Strikethrough</h1>
 <p>
  This paragraph has strikethrough text.
 </p>
 </body>
</html>

Text-decoration has a few other rarely used options, such as

  • Overline: The overline attribute places a line over the text. Except for a few math and chemistry applications (which would be better done in an equation editor and imported as images), it's hard to say when this might be used.

    image1.jpg
  • Blink: The blink attribute is a distant cousin of the legendary tag in Netscape and causes the text to blink on the page. The tag (along with gratuitous animated GIFs) has long been derided as the mark of the amateur. Avoid blinking text at all costs.

There's an old joke among Internet developers: The only legitimate place to use the tag is in this sentence: Schrodinger's cat is not dead. Nothing is funnier than quantum mechanics illustrated in HTML.

About This Article

This article is from the book:

About the book author:

Andy Harris taught himself programming because it was fun. Today he teaches computer science, game development, and web programming at the university level; is a technology consultant for the state of Indiana; has helped people with disabilities to form their own web development companies; and works with families who wish to teach computing at home.

This article can be found in the category: