CSS text-decoration property specifies the style and color for a decoration line. It is a shorthand for the below three properties:
Example:
.p1{
text-decoration: underline;
}
.p2{
text-decoration: underline red wavy;
}
.p3{
text-decoration: overline blue dotted;
}
.p4{
text-decoration: line-through;
}
.p5{
text-decoration: underline overline;
}
CSS Syntax
The text-decoration property has the below syntax:
text-decoration: text-decoration-line text-decoration-color text-decoration-style|initial|inherit;
Property Values
The text-decoration property accepts the following values:
| text-decoration-line | Specifies the type of text decoration line such as underline, overline, line-through, etc. |
| text-decoration-color | Specifies the color of the text decoration line. The color can be specified in any valid CSS color format such as ‘color name’, ‘HEX’, ‘RGB’, ‘HSL’, etc. |
| text-decoration-style | Specifies the style of the text decoration line such as ‘solid’, ‘dotted’, ‘wavy’, etc. |
| initial | Sets the text-decoration property to its default value. |
| inherit | Inherits the text-decoration property from its parent element. |
General Info
| Default Value | none currentColor solid |
| Inherited | No |
| JavaScript Usage | element.style.textDecoration = “underline”; |
