CSS text-decoration property

Description

CSS text-decoration defines the style, color and position of text-decoration-line. It is a shorthand property of text-decoration-line, text-decoration-style, and text-decoration-color.

Syntax

text-decoration : text-decoration-line    text-decoration-style    text-decoction-color

Property values

text-decoration-line

noneDefault

In this case, there is no text-decoration line.

text-decoration-line: none;

underline

defines a line below the text.

text-decoration-line: underline;

overline

defines a line above the text.

text-decoration-line: overline;

line-through

It represents a line passing through the middle of text horizontally.

text-decoration-line: line-through;

blink

blinks the text between visibile and invisible. Now, it is deprecated. Animation is preferable to blink the text.

text-decoration-line: blink;

text-decoration-style

solidDefault

The text decoration line is a solid line.

text-decoration-style: solid;

double

The text decoration line is double line.

text-decoration-style: double;

dotted

The line consists of series of dotts.

text-decoration-style: dotted;

dashed

The line consists of series of squared shaped dashes.

text-decoration-style: dashed;

wavy

The line is not straight but wavy type.

text-decoration-style: wavy;

text-decoration-color

currentColorDefault

currentColor represents the same color as of text.

text-decoration-color: currentColor;

color-name

Any color name can be used as the value. red value represents red color.

text-decoration-color: red;

rgb value

It is an rgb value of red color.

text-decoration-color: rgb(0,255,0);

hexadecimal value

It is an hexadecimal notation of blue color.

text-decoration-color: #0000ff;

Applicable to

It applies to all elements

#CSS digger
Was this article helpful?

 
We are learning text decoration property
×

Ctrl+D