Перейти к содержанию

text-decoration-skip-ink

Свойство text-decoration-skip-ink определяет способ рисования надстрочных и нижних подчеркиваний при прохождении над верхними и нижними элементами глифов.

Текст

Синтаксис

/* Single keyword */
text-decoration-skip-ink: none;
text-decoration-skip-ink: auto;
text-decoration-skip-ink: all;

/* Global keywords */
text-decoration-skip: inherit;
text-decoration-skip: initial;
text-decoration-skip: unset;

Значения

none
Подчеркивания и надчеркивания рисуются по всей длине текстового содержимого, включая части, которые пересекают нижние и верхние элементы глифов.
auto
Браузер может прерывать подчеркивание и наложение, чтобы они не касались глифа и не приближались к нему. То есть они прерываются там, где в противном случае они пересекали бы глиф.
all
Браузер должен прерывать подчеркивание и подчеркивание, чтобы они не касались глифа и не приближались к нему. Это может быть полезно с некоторыми китайскими, японскими или корейскими (CJK) шрифтами, где автоматическое поведение может не создавать прерываний.

Определение
Начальное значение auto
Применяется ко всем элементам
Наследуется да
Вычисленное значение как определено
Тип анимации дискретный

Поддержка браузерами

Примеры

Пример 1

Пример 2

p {
  font-size: 1.5em;
  text-decoration: underline blue;
  text-decoration-skip-ink: auto; /* this is the default anyway */
}

.no-skip-ink {
  text-decoration-skip-ink: none;
}

.skip-ink-all {
  text-decoration-skip-ink: all;
}

<p>You should go on a quest for a cup of coffee.</p>
<p class="no-skip-ink">Or maybe you'd prefer some tea?</p>
<p>
  この文は、 text-decoration-skip-ink: auto
  の使用例を示しています。
</p>
<p class="skip-ink-all">
  この文は、 text-decoration-skip-ink: all
  の使用例を示しています。
</p>

text-decoration-skip-ink

См. также

  • Элемент a — текст ссылки
  • Элемент u — подчеркнутый текст

Ссылки