css властивість text-decoration-color
Встановлює колір оздоблення тексту, котрий додається через властивість text-decoration.
CSS властивість text-decoration-color працює тільки на елементах з видимим text-decoration.
Якщо не використовувати text-decoration-color, будь-яке підкреслення, як правило, відображатиметься в тому ж кольорі, що й підкреслений текст. Те саме стосується і перекресленого тексту та тексту з лінією над ним. text-decoration-color дозволяє вказати інший колір для тексту та його оздоблення.
| Нотатка: | Safari підтримує властивість |
| Нотатка: | Firefox до версії 36 підтримує властивість - |
| Порада: | При одночасному налаштуванні декількох властивостей оздоблення рядка, можливо, буде зручніше скористатися властивістю |
Синтаксис
text-decoration-color: color|initial|inherit;Властивість text-decoration-color може отримувати 3 значення:
| Значення без задання: | Співпадає з кольором тексту |
|---|---|
| Наслідує: | Ні |
| Анімується: | Так |
| JavaScript синтаксис: | object.style.textDecorationColor="red" |
Переглядачі
| Переглядач | ||||||
|---|---|---|---|---|---|---|
| text-decoration-color | 57.0 |
Не підтримується |
36.0 |
7.1 -webkit- |
Не підтримується |
44.0 |
| Переглядач | |||
|---|---|---|---|
| text-decoration-color | Не підтримується |
36.0 |
8.0 -webkit- |
Мобільних переглядачів ще не додано.
Приклади
Приклад використання
Лінія під посиланням буде червоного кольору
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>text-decoration-color</title>
<style>
a {
text-decoration-color: red;
}
</style>
</head>
<body>
<a href="page/1.html">Посилання</a>
</body>
</html>Синтаксис властивості
p {
text-decoration: underline;
-moz-text-decoration-color: red; /* Для Firefox */
text-decoration-color: red;
}