text-decoration
text-decoration
| Браузер | Internet Explorer | Netscape | Opera | Safari | Mozilla | Firefox | ||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Версия | 5.5 | 6.0 | 7.0 | 7.0 | 8.0 | 7.0 | 8.0 | 9.0 | 2.0 | 3.0 | 1.7 | 1.0 | 2.0 | 3.0 |
| Поддерживается | Част. | Част. | Част. | Да | Да | Да | Да | Да | Да | Да | Да | Да | Да | Да |
Част. — поддерживается частично.
Краткая информация
| CSS | CSS1 |
|---|---|
| Значение по умолчанию | none |
| Наследуется | Нет |
| Применяется | Ко всем элементам |
| Аналог HTML | <U>, <S>, <STRIKE> |
| Ссылка на спецификацию | http://www.w3.org/TR/CSS21/text.html#propdef-text-decoration |
Описание
Добавляет оформление текста в виде его подчеркивания, перечеркивания, линии
над текстом и мигания. Одновременно можно применить более одного стиля, перечисляя
значения через пробел.
Синтаксис
text-decoration: blink | line-through | overline | underline | none
Аргументы
- blink
- Устанавливает мигающий текст. Такой текст периодически, примерно раз в секунду
исчезает, потом вновь появляется на прежнем месте (пример). - line-through
- Создает перечеркнутый текст (пример).
- overline
- Линия проходит над текстом (пример).
- underline
- Устанавливает подчеркнутый текст (пример).
- none
- Отменяет все эффекты, в том числе и подчеркивания у ссылок, которое задано
по умолчанию.
Пример
<!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">Lorem ipsum dolor sit amet</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
не распространяет оформление родительского элемента на дочерние, а переносит
только подчеркивание.