CSS - text-decoration

Advertisements

Previous Page
Next Page  

Description

The text-decoration property is used to add "decorations" to inline content.

Possible Values

  • none − No decoration should be added to the inline text.

  • underline − An underline is drawn beneath the inline text.

  • overline − An overline is drawn above the inline text.

  • line-through − A line should be drawn through the middle of the inline text.

  • blink − The inline text should blink on and off, analogous to the BLINK element introduced by Netscape.

Applies to

All the HTML elements.

DOM Syntax

object.style.textDecoration = "underline";

Example

Following is the example which demonstrates how to decorate a text.

NOTE − Blink property does not work with all the browsers.

Live Demo 
<html>
   <head>
   </head>

   <body>
      <p style = "text-decoration:underline;">
         This will be underlined
      </p>
      
      <p style = "text-decoration:line-through;">
         This will be striked through.
      </p>
      
      <p style = "text-decoration:overline;">
         This will have a over line.
      </p>
      
      <p style = "text-decoration:blink;">
         This text will have blinking effect
      </p>
   </body>
</html>

This will produce following result −

Advertisements