text-decoration-style property CSS Reference

Definition and Usage

The text-decoration-style CSS property defines the style of the lines specified by text-decoration-line. The style applies to all lines, there is no way to define different style for each of the line defined by text-decoration-line.

If the specified decoration has a specific semantic meaning, like a line-through line meaning that some text has been deleted, authors are encouraged to denote this meaning using an HTML tag, like <del> or <s>. As browsers can disabled styling in some cases, the semantic meaning won't disappear in such a situation.

  • Initial solid
  • Applies to all elements
  • Inherited no
  • Media visual
  • Computed Value as specified
  • Animatable no
  • Canonical order the unique non-ambiguous order defined by the formal grammar


Formal syntax: solid | double | dotted | dashed | wavy
text-decoration-style: solid
text-decoration-style: double
text-decoration-style: dotted
text-decoration-style: dashed
text-decoration-style: wavy
text-decoration-style: inherit


solid double dotted dashed wavy

Is one of the following keywords :

solidDraws a single line
doubleDraws a double line
dottedDraws a dotted line
dashedDraws a dashed line
wavyDraws a wavy line
Is a keyword indicating to reuse the value calculated on the parent element.


.example {
    text-decoration-line: underline;
    text-decoration-style: wavy;
    text-decoration-color: red;


Desktop browsers

FeatureFirefox (Gecko)ChromeInternet ExplorerOperaSafari
Basic support6.0 (6.0)-moz24.0 -webkitNot supported15.0 -webkitNot supported

Mobile browsers

FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support(Yes)24.0 -webkit6.0 (6.0)-mozNot supported15.0 -webkitNot supported

Relative articles