text-emphasis

Свойство text-emphasis для выделения текста применяет к тексту метки выделения (кроме пробелов и управляющих символов).

Демо

Текст

• hanging-punctuation
• hyphens
• letter-spacing
• line-break
• overflow-wrap
• paint-order
• tab-size
• text-align
• text-align-last
• text-indent
• text-justify
• text-size-adjust
• text-transform
• white-space
• word-break
• word-spacing

• letter-spacing
• text-decoration
• text-decoration-color
• text-decoration-line
• text-decoration-style
• text-decoration-thickness
• text-decoration-skip
• text-decoration-skip-ink
• text-emphasis
• text-emphasis-color
• text-emphasis-position
• text-emphasis-style
• text-indent
• text-rendering
• text-shadow
• text-underline-position
• text-transform
• white-space
• word-spacing

Синтаксис

/* Initial value */
text-emphasis: none; /* No emphasis marks */

/* <string> value */
text-emphasis: 'x';
text-emphasis: '点';
text-emphasis: '\25B2';
text-emphasis: '*' #555;
text-emphasis: 'foo'; /* Should NOT use. It may be computed to or rendered as 'f' only */

/* Keywords value */
text-emphasis: filled;
text-emphasis: open;
text-emphasis: filled sesame;
text-emphasis: open sesame;

/* Keywords value combined with a color */
text-emphasis: filled sesame #555;

/* Global values */
text-emphasis: inherit;
text-emphasis: initial;
text-emphasis: unset;

Значения

none

Без выделения

filled

Форма заполнена сплошным цветом.

open

Форма полая.

dot

Отображать маленькие кружки в виде отметок. Заполненная точка - • (U+2022), а открытая точка - ◦ (U+25E6).

circle

Показать большие круги в виде отметок. Заполненный кружок - ● (U+25CF), а открытый кружок - ○ (U+25CB).

double-circle

Отображать двойные кружки в виде отметок. Заполненный двойной кружок - ◉ (U+25C9), а открытый двойной кружок - ◎ (U+25CE).

triangle

Отображать треугольники в виде отметок. Заполненный треугольник - ▲ (U+25B2), а открытый треугольник - △ (U+25B3).

sesame

Показать сезам в виде отметок. Заполненный - ﹅ (U+FE45), а открытый - ﹆ (U+FE46).

<строка>

Отобразить данную строку в виде отметок. Авторам не следует указывать более одного символа . Браузер может обрезать или игнорировать строки, состоящие из нескольких символов.

<цвет>

Определяет цвет знака. Если цвет отсутствует, по умолчанию используется currentColor.

Спецификация

• CSS Text Decoration Module Level 3

Пример

h2 {
    -webkit-text-emphasis-style: triangle open;
    text-emphasis-style: triangle open;
}

Результат:

См. также

• text-emphasis-style
• text-emphasis-color
• text-emphasis-position

Ссылки

• text-emphasis

Комментарии