CSS свойство text-decoration-color

Свойство text-decoration-color устанавливает цвет текстового оформления. Можете выбрать цвет отсюда: HTML Цвета.

Значение по умолчанию	currentColor
Применяется	Ко всем элементам, а также к ::first-letter и ::first-line.
Наследуется	Нет
Анимируемое	Да. Цвет анимируем.
Версия	CSS1, CSS3
DOM синтаксис	object.style.textDecorationColor = "#ccc";

Синтаксис

text-decoration-color: color | initial | inherit;

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок документа</title>
    <style>
      p {
      text-decoration: overline underline;
      -webkit-text-decoration-color: #8ebf42; /* Safari */  
      text-decoration-color: #8ebf42;
      }
    </style>
  </head>
  <body>
    <h2>Пример свойства text-decoration-color</h2>
    <p>Lorem Ipsum - это текст-"рыба"...</p>
  </body>
</html>

Попробуйте сами!

В данном примере использовано расширение -webkit- для Safari.

Рассмотрим другой пример со свойством text-decoration-color:

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок документа</title>
    <style>
      p { 
      text-decoration-line: underline;
      text-decoration-color: #666;
      text-decoration-style: wavy;
      }
      s {
      text-decoration-line: line-through;
      text-decoration-color: #c91010;
      }
    </style>
  </head>
  <body>
    <h2>Пример свойства text-decoration-color</h2>
    <p>Lorem ipsum<s>это текст-"рыба"</s>...</p>
  </body>
</html>

Попробуйте сами!

Значения

Значение	Описание
color	Устанавливает цвет текстового оформления. Могут быть использованы названия цветов, цветовые коды hexadecimal, rgb(), rgba(), hsl(), hsla().
initial	Устанавливает свойство в значение по умолчанию.
inherit	Значение элемента наследуется от родительского элемента.