У text-decoration-skipвласності визначає , де текст підкресленням, Overline або Закреслені повинні ламатися. Це покращує розбірливість оформленого тексту та виправляє пунктуаційну граматику для деяких мов.
Ось один приклад:
a ( text-decoration-skip: ink; )Вгору! inkЗначення було змінено на абсолютно нову властивість, text-decoration-skip-ink: auto;.
Якщо ваш браузер підтримує цю властивість, то тут ви помітите, що спадний код кожного символу (наприклад, "y" та "p") має невеликі пробіли навколо межі:
Перегляньте текст-переклад тексту-пропуску за допомогою CSS-Tricks (@ css-tricks) на CodePen.
Якщо ваш браузер не підтримує цю функцію, то цього слід очікувати від власності в підтримуваному браузері:
text-decoration-skip в OSX та iOS
Наприкінці 2014 року Apple внесла зміни до text-decorationбраузерів Safari та iOS, що імітують те, як text-decoration-skip: ink;має працювати. Хоча жодне зі text-decoration-skipзначень офіційно ще не реалізовано, ви можете відключити цю поведінку за замовчуванням за допомогою -webkit-text-decoration-skip: none;.
Див. Pen -webkit-text-decoration-skip: none; від CSS-Tricks (@ css-tricks) на CodePen.
Пов’язані
text-decorationtext-decoration-colortext-decoration-linetext-decoration-style
Більше інформації
- Модуль оформлення тексту CSS Рівень 4
Чернетка редактора text-decoration-skipв MSDN.- Обговорення додавання
trailing-spacesяк значення зі списку розсилки W3C. - Покращення читабельності тексту для користувачів з дислексиєю за допомогою підкреслення пропуску чорнил
- text-decoration-skip on MDN
- text-decoration-skip-ink на MDN
Підтримка браузера
Дані про підтримку веб-переглядача подані компанією Caniuse, яка містить більше деталей. Цифра вказує на те, що браузер підтримує цю функцію на цій версії та вище.
Робочий стіл
| Chrome | Firefox | IE | Край | Сафарі |
|---|---|---|---|---|
| 91 | 87 | Ні | 88 | ТП |
Мобільний / планшетний
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | 85 | 81 | 14,0-14,4 * |