Text-decoration

The text-decoration property describes decorations that are added to the text of an element.

The text-decoration CSS property is used to set the text formatting to underline, overline, line-through.

Underline and overline decorations are positioned under the text, line-through over it.

CSS Syntax

text-decoration: none | underline | overline | line-through | initial | inherit;

Let's see an example:

<!DOCTYPE html>
<html>
   <head>
       <title>Title of the document</title>
       <style>          
           h2{           
               text-decoration: underline;
           }
           div{           
               text-decoration: overline;
           }        
           p{   	
                text-decoration: line-through ;
           }    
       </style>
   </head>
   <body>
	
       <h2>This is text-decoration example.</h2>
       
       <p>Some paragraph with the line-through property.</p>

       <div> Example for the text-decoration property. </div>

   </body>
</html>

Property Values

Value Descriptions
none It produces no text decoration and removes any decoration.
underline It draws a horizontal line below the text.
overline It draws a horizontal line above the text.
line-through It draws a horizontal line through the text.
initial It makes the property use its default value.
inherit It inherits the property from its parents element.