CSS text-decoration-style Property


Example

Display a wavy line under a <p> element:

p {
    -moz-text-decoration-style: wavy; /* Code for Firefox */
    text-decoration: underline;
}

Try it yourself »

Definition and Usage

The text-decoration-style property specifies how the line, if any, will display.

Default value: solid
Inherited: no
Animatable: no. Read about animatable
Version: CSS3
JavaScript syntax: object.style.textDecorationStyle="wavy" Try it


Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Numbers followed by -moz- specify the first version that worked with a prefix.

Property
text-decoration-style Not supported Not supported 6.0 -moz- Not supported Not supported


CSS Syntax

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

Property Values

Value Description Play it
solid Default value. The line will display as a single line Play it »
double The line will display as a double line Play it »
dotted The line will display as a dotted line Play it »
dashed The line will display as a dashed line Play it »
wavy The line will display as a wavy line Play it »
initial Sets this property to its default value. Read about initial Play it »
inherit Inherits this property from its parent element. Read about inherit


Related Pages

CSS tutorial: CSS Text

HTML DOM reference: textDecorationStyle property



Color Picker

colorpicker