Свойство TEXT-DECORATION

Браузер Internet Explorer Firefox Mozilla Opera Netscape Safari
Версия 5.5 6.0 7.0 1.0 2.0 1.7 7.0 8.0 9.0 6.0 7.0 8.0 1.0
Поддержка Част. Част. Част. Част. Поддерживается Поддерживается Поддерживается Поддерживается Поддерживается Поддерживается Поддерживается Поддерживается Поддерживается

Част. - поддерживается частично.

Краткая информация

CSS CSS1
Значение по умолчанию none
Наследование Нет
Применяется Ко всем элементам
Аналог HTML <U>, <S>, <STRIKE>
Ссылка на спецификацию http://www.w3.org/TR/CSS21/text.html#propdef-text-decoration

Описание

Задается оформление текста: подчеркивание, перечеркивание, линии сверху текста и для некоторых браузеров мигание. Сразу можно использовать один или несколько стилей разделяя пробелом

Синтаксис

Аргументы

blink Задает мигающий текст. Такой текст периодически, примерно раз в секунду исчезает, потом вновь появляется на прежнем месте (пример).
line-through Создает перечеркнутый текст (пример).
overline Линия проходит над текстом (пример).
underline Задает подчеркнутый текст (пример).
none Отменяет все эффекты, в том числе и подчеркивания у ссылок, которое задано по умолчанию.

Пример

Валидный HTML
Валидный CSS
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>text-decoration</title>
<style type="text/css">
A {
 text-decoration: none; /* Убираем подчеркивание у ссылок */
}

A:hover {
 text-decoration: underline; /* Добавляем подчеркивание при наведении курсора мыши на ссылку */
}
</style>
</head>
<body>

<p><a href="link1.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 хотя и позволяет использовать значение blink, текст показывает как обычно, без всякого мерцания.

Согласно спецификации CSS, если для элемента задан вид форматирования, а для его наследника нет, все равно свойства родителя будут передаваться его вложенным элементам. Так, если используется подчеркнутый параграф, а внутри него расположен неподчеркнутый элемент, выделяющий слово другим цветом, все слова в параграфе будут подчеркнуты, включая и выделенные другим цветом слова. Для браузера Netscape 6, однако, установка text-decoration: none уберет все эффекты, независимо от оформления родительского элемента. Вдобавок, Netscape 6 не распространяет оформление родительского элемента на дочерние, а переносит только подчеркивание.


Комментарий