text-decoration-line property CSS Reference

---

Definition and Usage

The text-decoration-line CSS property sets what kind of line decorations are added to an element.

Underline and overline decorations are positioned under the text, line-through over it.

• Initial none
• Applies to all elements
• Inherited no
• Media visual
• Computed Value as specified
• Animatable no
• Canonical order order of appearance in the formal grammar of the values

---

Syntax

Formal syntax: none | [ underline || overline || line-through || blink ]

text-decoration-line: none /* This is the only keyword that cannot be mixed with other */
text-decoration-line: underline
text-decoration-line: overline
text-decoration-line: line-through
text-decoration-line: underline overline
text-decoration-line: overline underline line-through
text-decoration-line: inherit

---

Values

Accepts none, or one or more whitespace separated values:

none

Produces no text decoration.

underline

Each line of text is underlined.

overline

Each line of text has a line above it.

line-through

Each line of text has a line through the middle.

blink

The text blinks (alternates between visible and invisible). Conforming user agents may simply not blink the text. This value is deprecated in favor of Animations.

---

Examples

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

---

Compatibility

Desktop browsers

Mobile browsers