text-decoration-skip
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.
Die text-decoration-skip-Eigenschaft von CSS legt fest, welche Teile des Inhalts eines Elements bei einer Textdekoration, die das Element beeinflusst, übersprungen werden müssen. Sie steuert alle Textdekorationslinien, die vom Element sowie von seinen Vorfahren gezeichnet werden.
Hinweis:
Die meisten anderen Browser bewegen sich in Richtung Unterstützung der einfacheren Eigenschaft text-decoration-skip-ink.
Syntax
/* Keyword values */
text-decoration-skip: none;
text-decoration-skip: objects;
text-decoration-skip: spaces;
text-decoration-skip: edges;
text-decoration-skip: box-decoration;
/* Multiple keywords */
text-decoration-skip: objects spaces;
text-decoration-skip: leading-spaces trailing-spaces;
text-decoration-skip: objects edges box-decoration;
/* Global values */
text-decoration-skip: inherit;
text-decoration-skip: initial;
text-decoration-skip: revert;
text-decoration-skip: revert-layer;
text-decoration-skip: unset;
Werte
none-
Nichts wird übersprungen. Somit wird die Textdekoration für den gesamten Textinhalt und über atomare Inline-Boxen hinweg gezeichnet.
objects-
Die gesamte Randbox des Elements wird übersprungen, wenn es sich um ein atomares Inline-Element wie ein Bild oder einen Inline-Block handelt.
spaces-
Alle Abstände werden übersprungen: alle Unicode-Leerzeichenzeichen und alle Worttrennzeichen, plus alle angrenzenden
letter-spacingoderword-spacing. leading-spaces-
Entspricht
spaces, jedoch werden nur führende Leerzeichen übersprungen. trailing-spaces-
Entspricht
spaces, jedoch werden nur nachfolgende Leerzeichen übersprungen. edges-
Der Anfang und das Ende der Textdekoration werden leicht von der Inhaltsecke der dekorierenden Box nach innen versetzt (z. B. um die halbe Linienbreite). Dadurch erhalten angrenzende Elemente separate Unterstreichungen. (Dies ist wichtig im Chinesischen, wo das Unterstreichen eine Form der Interpunktion darstellt.)
box-decoration-
Die Textdekoration wird über den Randbereich, die Rahmen und die Abstände der Box übersprungen. Dies hat nur Auswirkungen auf Dekorationen, die von einem Vorfahren vorgegeben werden; eine dekorierende Box wird niemals über ihre eigene Boxdekoration gezeichnet.
Formale Definition
| Anfangswert | objects |
|---|---|
| Anwendbar auf | alle Elemente |
| Vererbt | Ja |
| Berechneter Wert | wie angegeben |
| Animationstyp | diskret |
Formaler Syntax
text-decoration-skip =
none |
auto
Beispiele
Überspringen von Kanten
HTML
<p>Hey, grab a cup of <em>coffee!</em></p>
CSS
p {
margin: 0;
font-size: 3em;
text-decoration: underline;
text-decoration-skip: edges;
}
Ergebnis
Spezifikationen
| Specification |
|---|
| CSS Text Decoration Module Level 4 # text-decoration-skipping |