| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
| 6.0+ | 1.0+ | 4.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ |
Коротка інформація
| Значення за замовчуванням | none |
|---|---|
| Наслідується | Ні |
| Застосовується | До всіх елементів |
| Посилання на специфікацію | http://www.w3.org/TR/CSS21/text.html#propdef-text-decoration |
Версії CSS
| CSS 1 | CSS 2 | CSS 2.1 | CSS 3 |
|---|---|---|---|
Опис
Додає оформлення тексту у вигляді його підкреслення, перекреслення, лінії над текстом та миготіння. Одночасно можна застосувати більше одного стилю, перераховуючи значення через пробіл.
Синтаксис
text-decoration: [ blink || line-through || overline || underline ] | none | inherit
Значення
- blink
- Встановлює миготливий текст. Такий текст періодично, приблизно раз на секунду зникає, потім знову з'являється на колишньому місці. Це значення наразі не підтримується браузерами і засуджується в CSS3, замість рекомендується використовувати анімацію.
- line-through
- Створює перекреслений текст (приклад).
- overline
- Лінія проходить над текстом (приклад).
- underline
- Встановлює підкреслений текст (приклад).
- none
- Скасовує всі ефекти, включаючи й підкреслення у посиланнях, яке задано за замовчуванням.
- inherit
- Значення успадковується від батька.
Приклад
HTML5CSS2.1IECrOpSaFx
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>text-decoration</title>
<style>
a {
text-decoration: none; /* Прибираємо підкреслення у посиланнях */
}
a:hover {
text-decoration: underline; /* Додаємо підкреслення
при наведенні курсора миші на посилання */
}
</style>
</head>
<body>
<p><a href="1.html">Стратегічна атака</a></p>
</body>
</html>Об'єктна модель
[window.]document.getElementById("elementID").style.textDecoration
[window.]document.getElementById("elementID").style.textDecorationBlink
[window.]document.getElementById("elementID").style.textDecorationLineThrough
[window.]document.getElementById("elementID").style.textDecorationNone
[window.]document.getElementById("elementID").style.textDecorationOverLine
[window.]document.getElementById("elementID").style.textDecorationUnderline
Браузери
Internet Explorer до версії 7.0 включно не підтримує значення inherit. Лінія, отримана за допомогою значення line-through в IE7 розташовується вище, ніж в інших браузерах; в IE8 ця помилка виправлена.