Справочник по CSS : Тематический указатель : Справочник по свойствам и атрибутам : Шрифт и текст : text-decoration
смотрим также
Материал из Справочник Web-языков
Содержание |
Атрибут text-decoration | Свойство textDecoration
Задает значение, которое показывает, где текст в объекте будет мигающим или, где будет подчеркнутым (надчеркнутым, зачеркнутым).
Синтаксис
HTML | { text-decoration : sDecoration } |
Скрипты | [ sDecoration = ] object.style.textDecoration |
Используемые значения
- sDecoration
- Строка, которая может определять и принимать одно из следующих значений:
- none
- Значение по умолчанию. Все эффекты у текста отменяются.
- underline
- Текст будет подчеркнут.
- overline
- Текст будет надчеркнут.
- line-through
- Текст будет зачеркнут.
- blink
- Текст будет мигающим.
Это свойство читается/записывается для всех объектов, кроме currentStyle (только чтение). Значением по умолчанию является none. Атрибут Каскадных таблиц стилей (CSS) не наследуется.
Замечания
Эффект от значения по умолчанию для разных тэгов различен:
- Значение по умолчанию будет underline для тэга a, когда он используется вместе с href, u и ins.
- Значение по умолчанию будет line-through для тэгов strike, s и del.
Если расположить значение none в конце списка значений, то все эффект от других значений нивелируется. Например, если для текста установлено {text-decoration: underline overline blink none}, то ни один из эффектов не будет отображаться.
Если в объекте нет текста, например объект img, или это пустой объект, например <em></em>, то эффектов от установки свойства textDecoration не будет.
Если атрибуту text-decoration в объекте body задано значение none, то объекты a все еще будут подчеркнуты. Для удаления этого эффекта подчеркивания, либо задайте для a значение inline, либо опишите значения для a как селектора в глобальной таблице стилей.
Определение свойства textDecoration для объекта типа block, автоматически означает применение значений этого свойства для всех потомков объекта типа block.
Примеры
Следующие примеры показывают как использовать атрибут text-decoration и свойство textDecoration для задания эфеекотов текста в объекте.
В первом примере используется атрибут text-decoration, чтобы сделать текст зачеркнутым.
<div style="text-decoration: line-through"> ... </div>
Во втором примере задаются различные эффекты для текста объекта span, когда происходят события onmouseover, onclick, ondblclick.
<span style="font-size: 14px" onmouseover="this.style.textDecoration='underline'" onclick="this.style.textDecoration='overline'" ondblclick="this.style.textDecoration='line-through'"> ... </span>
В третьем примере показывается, что хотя атрибут text-decoration не наследуется, для потомков будет применяться тот же эффект, что и для объектов-родителей. И даже если потомки будут иметь различные цвета (color), цвет эффектов все равно будет такой же, как цвет объекта-родителя.
<html> <head> <style type="text/css"> .redunderline { color: red; text-decoration: underline; } .blueoverline { color: blue; text-decoration: overline; } </style> </head> <body> <div class="redunderline"> This <b>div</b> has text decoration set to underline, <span class="blueoverline">but this <b>span</b> has it set to overline.</span> The <b>div</b> continues here.</div> </body> </html>
Стандарты
Это свойство описано в Cascading Style Sheets (CSS), Level 1 (CSS1)
Поддерживаемые браузеры
Internet Explorer частично 5.5, частично 6.0, частично 7.0, 8.0
Opera 7.0, 8.0, 9.2, 9.5
Safari 1.3, 2.0, 3.1
Firefox 1.5, 2.0, 3.0
В Internet Explorer часто при задании значения blink, текст все равно остается немерцающим.
Смотри также
textDecorationLineThrough, textDecorationNone, textDecorationOverline, textDecorationUnderline
Ссылки на источники
https://msdn.microsoft.com/en-us/library/ms531165(VS.85).aspx