De text-decoration-skipeigenschap geeft aan waar een onderstreepte, bovenlijnde of doorgehaalde tekst moet worden afgebroken. Dit verbetert de leesbaarheid van versierde tekst en corrigeert de leestekensgrammatica voor sommige talen.
Hier is een voorbeeld:
a ( text-decoration-skip: ink; )Let op! De inkwaarde is gewijzigd naar een geheel nieuw pand text-decoration-skip-ink: auto;,.
Als uw browser deze eigenschap ondersteunt, ziet u hier dat de afstammelingen van elk teken (zoals "y" en "p") kleine witte spaties rond de rand hebben:
Zie de Pen text-decoration-skip door CSS-Tricks (@ css-tricks) op CodePen.
Als uw browser deze functie niet ondersteunt, moet u dit in een ondersteunende browser van de accommodatie verwachten:
text-decoration-skip in OSX en iOS
Eind 2014 bracht Apple een wijziging aan text-decorationin Safari- en iOS-browsers die lijken op hoe ze text-decoration-skip: ink;zouden moeten werken. Hoewel geen van de text-decoration-skipwaarden officieel is geïmplementeerd, kunt u dit standaardgedrag uitschakelen met -webkit-text-decoration-skip: none;.
Zie de Pen -webkit-text-decoration-skip: none; door CSS-Tricks (@ css-tricks) op CodePen.
Verwant
text-decorationtext-decoration-colortext-decoration-linetext-decoration-style
Meer informatie
- CSS Text Decoration Module Level 4
Editor's Draft text-decoration-skipbij MSDN.- Bespreking van het toevoegen
trailing-spacesals waarde uit de W3C-mailinglijst. - Verbetering van de leesbaarheid van tekst voor dyslectische gebruikers met onderstrepingen die inkt overslaan
- text-decoration-skip op MDN
- text-decoration-skip-ink op MDN
Browser-ondersteuning
Deze browserondersteuningsgegevens zijn van Caniuse, die meer details bevat. Een getal geeft aan dat de browser de functie ondersteunt vanaf die versie.
Bureaublad
| Chrome | Firefox | D.W.Z | Rand | Safari |
|---|---|---|---|---|
| 91 | 87 | Nee | 88 | TP |
Mobiel / tablet
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | 85 | 81 | 14.0-14.4 * |