Свойство CSS text-decoration используется для установки форматирования текста и может иметь значения: underline , overline , line-through,inherit,none или blink. . Это значит, что текст можно подчеркнуть, провести линию под или над текстом и т. д. Есть возможность применить от одного до нескольких значений которые нужно прописывать через пробел. Если же к вашему тексту передаётся по наследству какой-либо стиль оформления, а вам это не нужно, просто используйте в качестве значения свойства “none”. Свойства применимы ко всем элементам. Создано в версии CSS1 и проходит валидацию согласно версии CSS3.
Синтаксис
text-decoration: [ blink line-through overline underline none inherit ]
Значения
- blink
- Устанавливает мигающий текст. Такой текст периодически, примерно раз в секунду исчезает, потом вновь появляется на прежнем месте. Это значение в настоящее время не поддерживается браузерами и не проходит валидацию, взамен предлагается использовать анимацию.
- line-through
- Создает перечеркнутый текст.
- overline
- Линия проходит над текстом.
- underline
- Устанавливает подчеркнутый текст.
- none
- Отменяет все эффекты, в том числе и подчеркивания у ссылок, которое установлено по умолчанию.
- inherit
- Значение наследуется у родителя.
Пример:
Свойство CSS text-decoration-line устанавливает, какие линии добавляются к элементу.
Свойство CSS text-decoration-color устанавливает цвет линии подчеркивания, overline или перечёркивания указанные в text-decoration-line .
Это предпочтительный способ задать цвет линий, а не с помощью комбинации других элементов HTML.
Свойство CSS text-decoration-style определяет стиль линий, указанных в text-decoration-line . Стиль применяется ко всем линиями и нет никакого способа определить свой стиль для каждого из них.
Синтаксис
text-decoration-line: [ underline || overline || line-through || blink ] text-decoration-style: [ solid || double || double || dashed || wavy ] text-decoration-color: [ currentColor || red || #00ff00 || rgba(255, 128, 128, 0.5) || transparent ]
text-decoration может быть так же использован в сокращённом виде:
.underlined {
text-decoration: underline dotted red;
}
В настоящее время только Firefox поддерживает эту возможность без префикса. Сафари и Хром поддерживают его только с –webkit префиксом.