Свойство text-decoration-line

Свойство text-decoration-line задает расположение линии у текста.

Свойство следует использовать совместно со свойствами text-decoration-style и text-decoration-color. Эти свойства расширяют действие свойства text-decoration, являясь более продвинутыми аналогами.

Синтаксис

селектор {
	text-decoration-line: underline | line-through | overline | none;
}

Значения

Значение	Описание
underline	Делает подчеркнутый текст.
line-through	Делает перечеркнутый текст.
overline	Делает линию над текстом.
none	Отменяет подчеркивание подчеркнутого элемента. Чаще всего используется для ссылок, так как они по умолчанию подчеркнуты.

Значение по умолчанию: none. Для ссылок значение по умолчанию: underline.

Пример

Давайте перечеркнем текст красной линией:

<div id="elem">
	Lorem ipsum dolor sit amet.
</div>

#elem {
	text-decoration-style: solid;
	text-decoration-color: red;
	text-decoration-line: line-through;
}