CSS
Text Decoration

The last formatting property is text-decoration. It is used to remove the underlines and other effects of the text. It is normally used to remove the underline from hyperlinks.

Property Values

The possible values are as follows:

ValuesDescription
noneIt removes any extra formatting and makes the text normal.
underlineIt adds an underline.
overlineIt adds a line over the text.
line-throughIt creates a strike through effect.
blinkIt makes the text flash on and off.
dashedIt makes the text dashed.
dottedIt makes the text dotted.
doubleThe line will display as a double line.
inheritIt inherits the decoration of the parent.
initialIt sets this property to its default value.
solidThe line will display as a single line. It is default value.
wavyIt gives wavy effect to text.

Text Decoration Example

Below examples will demonstrate the basic architecture of Text Decoration

                    

              
p {
  text-decoration-line: underline;
  text-decoration-style: wavy;
  text-decoration-color: red;
}

It can also be written as

                    

p{
  text-decoration: underline wavy red;
}

Example:
                    

<!doctype html>  
<html>
    <head>
        <title>...</title>
    </head>
  
    <body>
       <p style="text-decoration: underline wavy red;">Learn CSS from PHPDocs.</p>
    </body>
</html>