/css/text-decoration:> Декор текста_
Свойство text-decoration
Синтаксис
CSS 1
CSS 2‒2.2
CSS 3
text-decoration: none | [ underline || overline || line-through || blink ] | inherit
Описание
Свойство text-decoration
добавляет к тексту дополнительные элементы декора, такие как подчёркивание, зачёркивание текста, линия над текстом.
Применяется: | ко всем элементам; |
---|---|
Наследование: | отсутствует; |
Проценты: | не используются; |
Медиа: | визуальные. |
Примечание
В CSS 3 можно устанавливать дополнительно цвет и тип линии.
JavaScript
[объект]
Поддержка браузерами
Chrome
Поддерж.[1]
Firefox
Поддерж.[1]
Opera
Поддерж.[1]
Maxthon
Поддерж.[1]
IExplorer
Поддерж.[1]
Safari
Поддерж.[1]
iOS
Поддерж.[1]
Android
Поддерж.[1]
[1] ‒ поддерживает синтаксис CSS 2-2.2.
Спецификация
Значения
- none
- Указывает на отсутствие элементов декора.
- underline
- Подчёркивает текст.
text-decoration: underline;
- overline
- Устанавливает линию над текстом.
text-decoration: overline;
- line-through
- Перечёркивает текст.
text-decoration: line-through;
- blink
- Создаёт мигающий текст. (Данное свойство не поддерживается большинством современных браузеров.)
- inherit
- Указывает, что элемент должен унаследовать параметры родительского элемента.
Начальное значение: «none
».
Пример использования
Листинг кода
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Свойство text-decoration</title>
</head>
<body>
<h1>Элементы декора</h1>
<p><span style="text-decoration: underline;">Подчёркнутый текст</span>.</p>
<p><span style="text-decoration: overline;">Надчёркнутый текст</span>.</p>
<p><span style="text-decoration: line-through;">Перечёркнутый текст</span>.</p>
<p><span style="text-decoration: blink;">Мигающий текст</span>.</p>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>Свойство text-decoration</title>
</head>
<body>
<h1>Элементы декора</h1>
<p><span style="text-decoration: underline;">Подчёркнутый текст</span>.</p>
<p><span style="text-decoration: overline;">Надчёркнутый текст</span>.</p>
<p><span style="text-decoration: line-through;">Перечёркнутый текст</span>.</p>
<p><span style="text-decoration: blink;">Мигающий текст</span>.</p>
</body>
</html>
Свойство text-decoration