Свойство
Описание
Задаёт, как выводить линию под или над текстом, когда линия пересекает выносные элементы букв, вроде «у», «р», «ц» и др. Линия может быть сплошной или прерываться, чтобы пропустить «хвостики» букв.
Синтаксис
text-decoration-skip-ink: auto | none;Подробности
| Значение | Описание |
| auto | Линия прерывается на выносных элементах символов. |
| none | Линия отображается сплошной. |
Пример
<!DOCTYPE html>
<html lang='ru'>
<head>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<title>Document</title>
</head>
<body>
<style>
#test-text {
padding: 20px;
background-color: rgb(140, 206, 228);
text-decoration: underline;
text-decoration-skip-ink: auto;
}
</style>
<div id='test-text'>
Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты. Пунктуация даже заголовок меня маленькая вершину ipsum диких свою. Назад маленький рукопись взобравшись алфавит единственное. Пунктуация даже заголовок меня маленькая вершину ipsum диких свою. Ручеек путь текстов реторический.
</div>
<style>
#test-text2 {
padding: 20px;
background-color: rgb(140, 206, 228);
text-decoration: underline;
text-decoration-skip-ink: none;
}
</style>
<div id='test-text2'>
Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты. Пунктуация даже заголовок меня маленькая вершину ipsum диких свою. Назад маленький рукопись взобравшись алфавит единственное. Пунктуация даже заголовок меня маленькая вершину ipsum диких свою. Ручеек путь текстов реторический.
</div>
</body>
</html>Читайте также
Стили не содержащие указанный селектор
Псевдокласс :not задаёт правила стилей для элементов, которые не содержат указанный селектор....
Стиль включенных элементов интерфейса
Псевдокласс :checked применяется к элементам интерфейса, таким как переключатели (checkbox), флажки (radio) и пункты списка (option), когда они находя...
Свойство outline-style
Устанавливает стиль внешней границы элемента.
В отличие от линии, задаваемой через border, линия через outline отображается вокруг элемента, не...
Селекторы атрибутов со значениями в конце
Устанавливает стиль для элемента в том случае, если значение атрибута оканчивается указанным текстом....