CSS — оформление текста
- Учебник CSS
- CSS — Дом
- CSS — Введение
- CSS — синтаксис
- CSS — Включение
- CSS — Единицы измерения
- CSS — Цвета
- CSS — Фоны
- CSS — Шрифты
- CSS — текст
- CSS — изображения
- CSS — ссылки
- CSS — Столы
- CSS — Бордюры
- CSS — поля
- CSS — списки
- CSS — заполнение
- CSS — Курсоры
- CSS — Контуры
- CSS — Размер
- CSS — полосы прокрутки
- Расширенный CSS
- CSS — Видимость
- CSS — Позиционирование
- CSS — Слои
- CSS — псевдоклассы
- CSS — псевдоэлементы
- CSS — @ Правила
- CSS — текстовые эффекты
- CSS — типы носителей
- CSS — выгружаемый носитель
- CSS — слуховой носитель
- CSS — Печать
- CSS — Макеты
- CSS — проверки
- Учебное пособие по CSS3
- CSS3 — Учебник
- CSS3 — закругленный угол
- CSS3 — изображения границ
- CSS3 — Мульти фон
- CSS3 — цвет
- CSS3 — Градиенты
- CSS3 — Тень
- CSS3 — текст
- CSS3 — веб-шрифт
- CSS3 — двумерное преобразование
- CSS3 — 3D-преобразование
- CSS3 — Анимация
- CSS3 — Несколько столбцов
- CSS3 — пользовательский интерфейс
- CSS3 — Размер коробки
- Адаптивный CSS
- CSS — адаптивный веб-дизайн
- Ссылки CSS
- CSS — вопросы и ответы
- CSS — Краткое руководство
- CSS — Ссылки
- CSS — ссылки на цвета
- CSS — ссылки на веб-браузер
- CSS — веб-безопасные шрифты
- CSS — Единицы
- CSS — Анимация
- Инструменты CSS
- CSS — преобразователь PX в EM
- CSS — выбор цвета и анимация
- Ресурсы CSS
- CSS — полезные ресурсы
- CSS — Обсуждение
- Выбранное чтение
- Примечания к экзаменам UPSC IAS
- Передовой опыт разработчиков
- Вопросы и ответы
- Эффективное составление резюме
- Вопросы для собеседования с персоналом
- Компьютерный глоссарий
- Кто есть кто
Предыдущая страница
Следующая страница
Описание
Свойство text-decoration используется для добавления «украшений» к встроенному содержимому.
Возможные значения
нет — Во встроенный текст не следует добавлять украшения.
подчеркивание — Подчеркивание рисуется под встроенным текстом.
надчеркивание — надстрочный текст рисуется надчеркиванием.
сквозной — Линия должна быть проведена через середину встроенного текста.
blink — встроенный текст должен мигать и выключаться, аналогично элементу BLINK, представленному Netscape.
Применяется к
Все элементы HTML.
Синтаксис DOM
object.style.textDecoration = "подчеркивание";
Пример
Ниже приведен пример, демонстрирующий, как украсить текст.
ПРИМЕЧАНИЕ . Свойство Blink работает не во всех браузерах.
Живая демонстрация
<голова>
<тело>
style = "text-decoration:underline;" >
Это будет подчеркнуто
style = "text-decoration:line-through;" >
Это будет зачеркнуто.
style = "text-decoration:overline;" >
Это будет иметь над линией.
style = "украшение текста:мигание;" >
Этот текст будет мигать
Это даст следующий результат —
Предыдущая страница Печать страницы Следующая страница
text-decoration · WebPlatform Docs
Резюме
CSS-свойство text-decoration используется для настройки форматирования текста: подчеркивание, надчеркивание, сквозная линия или мерцание. подчеркивание и надчеркивание располагаются под текстом, а над ним — через линию.
Обзорная таблица
- Исходное значение
-
нет - Относится к
- Все элементы
- Унаследовано
- Нет
- СМИ
- визуальный
- Расчетное значение
- Как указано
- Анимируемый
- Нет
- Свойство объектной модели CSS
-
текстУкрашение - Проценты
- ???
Синтаксис
-
украшение текста: мигание -
украшение текста: сквозное -
украшение текста: нет -
украшение текста: надчеркивание -
украшение текста: подчеркивание
Значения
- нет
- Не создает текстовое оформление.
- подчеркивание
- Каждая строка текста подчеркнута.
- над чертой
- Над каждой строкой текста есть строка.
- сквозной
- Каждая строка текста имеет линию посередине.
- мигает
- Текст мигает.
Примеры
Подчеркнутый текст
Текст над чертой
Через текст
Мигающий текст
Смешанный декоративный текст
[Просмотреть живой пример](http://code.webplatform.org/gist/7283381)
.under { text-decoration: underline; }
.over {украшение текста: надстройка; }
.through { text-decoration: line-through; }
.blink {украшение текста: мигание; }
.mixed { text-decoration: подчеркивание, надчеркивание, сквозная линия; }
Использование
Оформление текста CSS уровня 3 преобразовало это свойство в сокращение для трех новых свойств CSS text-decoration-color, text-decoration-line и text-decoration-style.
Как и для любого другого сокращенного свойства, это означает, что оно сбрасывает их значение по умолчанию, если оно явно не установлено в сокращении.
Браузеры могут игнорировать значение blink (без объявления недействительным), как это делают Internet Explorer и Safari. Поддерживается Firefox (Gecko) и Opera. Обратите внимание, что не мигание текста является одним из методов выполнения контрольной точки 3.3 WAI-UAAG.
Текстовые декорации рисуются на дочерних элементах. Это означает, что невозможно отключить на потомке оформление текста, указанное на одном из его предков.
Например, в разметке:
В этом тексте есть некоторые выделенные слова.
правило стиля:
p { text-decoration: underline }
приведет к подчеркиванию всего абзаца. Однако правило стиля:
em { text-decoration: none }
не вызовет никаких изменений; весь абзац все равно будет подчеркнут. (Однако правило em { text-decoration: overline } приведет к тому, что на «некоторых выделенных словах» появится второе украшение.
Значение по умолчанию отличается для следующих тегов.
- Значение по умолчанию подчеркнуто для a при использовании с href , u и ins .
- Значение по умолчанию: сквозной для страйк , с и дел .
Если значение none помещено в конец значений, все значения очищаются. Например, установка {text-decoration: underline overline blink none} приводит к тому, что ни одно из украшений не отображается. Если объект не имеет текста (например, объект img в HTML) или является пустым объектом (например, ), это свойство не действует. Если вы установите для атрибута text-decoration значение none в теле , объекты a по-прежнему подчеркнуты. Чтобы убрать подчеркивание с объектов a, либо установите встроенный стиль, либо используйте a в качестве селектора в глобальной таблице стилей.