The property text-decoration-style defines the style of the lines drawn to decorate the text specified in the element. The values ​​have the same meaning as for the property border-style.

Initial Value solid
Applies to All elements, including ::first-letter and ::first-line
Inheritance no
Animation discrete

The property text-decoration-style changes the type of line above the text: single line, double line, dotted line, dashed line, or wavy line.

The property should be used in conjunction with the text-decoration-line and text-decoration-color properties. These properties extend the function of the property text-decoration, being more advanced counterparts.

Decoration lines have color, display position, and thickness values in addition to shape. Each value is manipulated by the properties below, but the text-decoration shorthand property can also be used to specify styles collectively.


/* Keyword values */

text-decoration-style: solid;
text-decoration-style: double;
text-decoration-style: dotted;
text-decoration-style: dashed;
text-decoration-style: wavy;

/* Global values */

text-decoration-style: inherit;
text-decoration-style: initial;
text-decoration-style: revert;
text-decoration-style: unset;


valuewhat it does
solidDefault value. Single solid line.
doubleDouble solid line.
dottedDotted line.
dashedDashed line.
wavyWavy line.
inheritThe value is inherited from the parent element.
initialSets the default value.