# text-decoration property

The `text-decoration` property adds various effects to a text: underline, line-through, overline.

## Syntax

`selector { text-decoration: underline | line-through | overline | none; }`

## Values

Value | Description
--- | ---
`underline` | Makes underlined text.
`line-through` | Makes line-through text.
`overline` | Makes a line above a text.
`none` | Undoes underlining of the underlined element. Most often used for links as they are underlined by default.

Default value: `none`. For links the default value is: `underline`.

## Example . The underline value

`<div id="elem"> Lorem ipsum dolor sit amet. </div>` `#elem { text-decoration: underline; }`

:

## Example . The line-through value

`<div id="elem"> Lorem ipsum dolor sit amet. </div>` `#elem { text-decoration: line-through; }`

:

## Example . The overline value

`<div id="elem"> Lorem ipsum dolor sit amet. </div>` `#elem { text-decoration: overline; }`

:

## See also

- the `text-decoration-style` property
  that allows you to change a line type
- the `text-decoration-color` property
  that allows you to change a line color
- the `text-decoration-line` property
  that allows you to change a line position

← →
↑
en ru