CSS text-decoration-line Property

A text decoration is an underline, an overline, or a strike-through line.

The text-decoration-line property specifies the type of decoration.

Options include underline, overline, and line-through.

Example

#

Text with an overline decoration.

Text with an overline

<p style="text-decoration-line: overline">
  Text with an overline
</p>

Syntax

text-decoration-line: none | underline | 
                      overline | line-through |
                      initial | inherit;

Values

#

Value Description
none Default. No line
underline Line under the text
overline Line over the text
line-through Line through the text
initial Sets the value to its default value.
inherit Inherits the value from its parent element.

More Examples

Click the buttons to see the different text-decoration-line values.

Text with a line-through text-decoration

<style>
  .text-decoration-line-example {
    text-decoration-line: line-through;
  }
</style>

<p class="text-decoration-line-example">
  Text with a line-through text-decoration
</p>

Browser support

This table shows when text-decoration-line support started for each browser.

Chrome
57.0 Mar 2017
Firefox
36.0 Feb 2015
IE/Edge
Not supported
Opera
44.0 Mar 2017
Safari
7.1 Sep 2014

You may also like

Guides