CSS text decoration is used to define the decoration of text. This property is a shorthand property by which we can define all the decorations of text in just single setting. These decorations are CSS decoration color, CSS decoration line and CSS decoration style.

The syntax for CSS text decoration is:

For example

lets take the example of HTML h2 tag contains some text to underline. CSS text decoration will make this heading tag underline.

Output

This is the heading

This is the HTML paragraph inside the div to show right alignment of text. This uses text align property to align the content.

This is the HTML paragraph inside the div to show right alignment of text. This uses text align property to align the content. This is second paragraph to show alignment

This is the HTML paragraph inside the div to show right alignment of text. This uses text align property to align the content. This is third paragraph to show alignment

CSS text decoration values list

The values and description of this property is used for defining decoration of text.

Sr. No. value Description
1 none Used to define the no decoration of the text. The value for this is none.
2 underline Used to make the text underline. The value for this is underline.
3 overline Used to make the text appear line over it. The value for this is overline.
4 line-through Used to make the text to appear like deleted text. The value for this is line-through.
5 initial Used to define as the property initial value.
6 inherit Used to define the computed value of property on the elements parent.
7 unset Used to define the property either acts as inherit or initial, depending on the property if it is inherited or not.

CSS text decoration blink

This text decoration blink will decorate the heading content to the blink.

Output

This is the heading

This is the HTML paragraph inside the div to show right alignment of text. This uses text align property to align the content.

This is the HTML paragraph inside the div to show right alignment of text. This uses text align property to align the content. This is second paragraph to show alignment

This is the HTML paragraph inside the div to show right alignment of text. This uses text align property to align the content. This is third paragraph to show alignment

You should also see for

If you have any query, you can send to Tutorialdeep mail id feedback@tutorialdeep.com.