Besedilo-dekoracija-preskoči-črnilo - CSS-triki

Anonim

text-decoration-skip-inkje lastnost, ki nadzoruje vedenje underlinein overline(vendar ne line-through), ko črta prehaja skozi del znaka / glifa. To vam omogoča natančno nastavljen nadzor nad tem, kako podčrtani ali podčrtani stiki delujejo z znaki, ki segajo nad vrh ali visijo pod dnom vrstice.

Prej se je to obravnavalo s text-decoration-skip: ink;kombinacijo lastnosti / vrednosti, po razpravah o tem, kako rešiti problem kaskadnih slogov, nenamerno prepisati sloge z nižjo prioriteto (zaradi števila razpoložljivih možnosti text-decoration-skip), bodo posamezne lastnosti razdeljene v nove lastnosti podobno text-decoration-skip-ink. Za več konteksta in primere, zakaj je bilo to spremenjeno, glejte to razpravo o GitHubu in zapisnike delovne skupine CSS o lastnostih.

Privzeto brskalniki "preskočijo" področja, kjer črnilo znaka prečka podčrtano črto, tako:

To vedenje lahko spremenite tako, da podčrtavanje / nadčrtanje preide skozi znak tako, da nastavite text-decoration-skip-inkna none.

.line-of-text-thats-already-underlined ( text-decoration-skip-ink: none; )

Posledica tega je, da se črta prereže skozi znake:

Sintaksa

text-decoration-skip-ink: auto | none;

Vrednote

text-decoration-skip-ink sprejema naslednje vrednosti:

  • auto je privzeta vrednost in bo pri preskakovanju znaka "preskočil" podčrtaje / podčrtaje.
  • none bo to podčrtavanje / podčrtaj prerezal skozi vaše biseče y in visoke t-je.

Primer

Oglejte si primer Pen text-decoration-skip-ink
s strani CSS-Tricks (@ css-tricks) na CodePen.

Podpora za brskalnik

Ti podatki o podpori brskalnika so od Caniuse, ki vsebuje več podrobnosti. Številka pomeni, da brskalnik podpira to funkcijo v tej različici ali novejši.

Namizje

Chrome Firefox IE Rob Safari
91 87 Ne 88 TP

Mobilni / tablični računalnik

Android Chrome Android Firefox Android iOS Safari
88 85 81 14,0-14,4 *

Sorodno

  • text-decoration-skip
  • text-decoration
  • text-decoration-color
  • text-decoration-line
  • text-decoration-style

Viri

  • Dokumentacija MDN
  • Oblikovanje podčrtaj v spletu
  • Uporabniki z disleksijo in podčrtano črnilo