In this section, we will learn what the text-decoration-style property is and how to use it in CSS.

CSS text-decoration-style Property Definition and Usage

In the `text-decoration-line` property section, we’ve mentioned that we can decorate a text content by adding a line to it.

By default, the style of this line is just a solid line!

But with the help of `text-decoration-style` property, we can style this solid line to other shape and forms.

CSS text-decoration-style Property Syntax

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

CSS text-decoration-style Property Value

The values for this property are:

double

dotted

wavy

dashed

solid

The two global values, “initial” and “inherit” can also be used for this property.

Example: underline text in CSS

See the Pen underline text in CSS by Enjoy Tutorials (@enjoytutorials) on CodePen.