CSS text-decoration-style Property

CSS text-decoration-style property defines the style of the text decoration line such as ‘solid’, ‘dashed’, ‘wavy’, etc.


  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-line: underline;
  text-decoration-style: double;
  text-decoration-line: underline;
  text-decoration-style: wavy;

Note: It is necessary to set a text-decoration-line before applying the text-decoration-style property. Otherwise, the text-decoration-style property has no effect on the text.

CSS Syntax

The text-decoration-style property has the following syntax:

text-decoration-style: solid|dashed|dotted|double|wavy|initial|inherit;

Property Values

The text-decoration-style property accepts the following values:

solidSets a solid text decoration line. This is the default value.
dashedSets a dashed text decoration line.
dottedSets a dotted text decoration line.
doubleDefines a double line as text-decoration.
wavySets a wavy text decoration line.
initialSets the text-decoration-style property to its default value(solid).
inheritInherits the text-decoration-style property from the parent element.

General Info

Default Valuesolid
JavaScript Usageelement.style.textDecorationStyle = “double”


  • Manoj Kumar

    Hi, My name is Manoj Kumar. I am a full-stack developer with a passion for creating robust and efficient web applications. I have hands-on experience with a diverse set of technologies, including but not limited to HTML, CSS, JavaScript, TypeScript, Angular, Node.js, Express, React, and MongoDB.