HTML and CSS [Electronic resources] نسخه متنی

Text Decoration

You can "decorate" text with CSSthat is, apply or remove a particular decorative value. This is done using the text-decoration property, with values as follows:

• none
  This is used primarily to remove the default underlines from links. See Chapter 10, "Link Effects, Lists, and Navigation."

• underline
  This places a line underneath the selected text. Usability specialists tend to shun underlined text because it can be confused with linked text.

• overline
  This places a line above the selected text.

• line-through
  This places a line through the selected text.

• blink
  Yep, you read that right. This causes text to blink, a feature that was introduced (and used to the point of pain) by Netscape in the early days. It works in all contemporary browsers but Internet Explorer.

Example 9-5 serves up an inline CSS sample for decorating text.

Example 9-5. Decorating text with CSS

<p style="text-decoration: underline;">This text is underlined</p>
<p style="text-decoration: overline;">This text has an overline</p>
<p style="text-decoration: line-through;">This text has a line-through</p>
<p style="text-decoration: blink;">This text blinks</p>

Figure 9-9 shows the results, with the exception of the blink.