text-decoration-style
Sets the visual style of the decoration lines. You can make underlines wavy, dashed, dotted, or double.
It is documented as part of the CSS Text Decoration specification.
Syntax
/* Usage Example */
.warning-text {
text-decoration: underline;
/* Makes the underline look like a red squiggle */
text-decoration-style: wavy;
text-decoration-color: red;
}
/* Syntax */
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: revert-layer;
text-decoration-style: unset;
text-decoration-style Browser support
Widely available
Since
2015 95% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2015.
57+
36+
12.1+
79+