CSS text-decorationProperty
Example
Set text decoration for h1, h2, h3, and h4 elements:
h1 {text-decoration:overline}
h2 {text-decoration:line-through}
h3 {text-decoration:underline}
Try it Yourself »
Attribute definition and usage instructions
The text-decoration property specifies the decoration added to text, such as underline, overline, line-through, etc.
The text-decoration property is a shorthand for the following three properties:
Syntax
/*关键值*/ text-decoration: none; /*没有文本装饰*/ text-decoration: underline red; /*红色下划线*/ text-decoration: underline wavy red; /*红色波浪形下划线*/ /*全局值*/ text-decoration: inherit; text-decoration: initial; text-decoration: unset;
| Default value: | none |
|---|---|
| Inherited: | no |
| version: | CSS1 |
| JavaScript Syntax: | object.style.textDecoration="overline" |
Browser Support
The numbers in the table specify the first browser version that fully supports the property.
| Property | |||||
|---|---|---|---|---|---|
| text-decoration | 1.0 | 3.0 | 1.0 | 1.0 | 3.5 |
Property value
| Value | Description |
|---|---|
| none | Default. Defines standard text. |
| underline | Defines a line below the text. |
| overline | Defines a line above the text. |
| line-through | Defines a line that passes beneath the text. |
| blink | Defines blinking text. |
| inherit | Specifies that the value of the text-decoration property should be inherited from the parent element. |
More Examples
Example
h1.under {
text-decoration: underline;
}
h1.over {
text-decoration: overline;
}
p.line {
text-decoration: line-through;
}
p.blink {
text-decoration: blink;
}
a.none {
text-decoration: none;
}
p.underover {
text-decoration: underline overline;
}
Try it Yourself »
Example
Dashed line and wavy line:
h1 {
text-decoration: underline overline dotted red;
}
h2 {
text-decoration: underline overline wavy blue;
}
Try it Yourself »
Related Articles
CSS Tutorial:CSS Text
other extensions