text-decoration-skip

Cette fonction est expérimentale
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

La propriété text-decoration-skip définit la façon dont les lignes décoratives doivent être appliquées aux éléments et aux caractères. Elle contrôle les lignes décoratives dessinées par l'élément courant ainsi que celles de ses ancêtres.

Valeur initialeobjects
Applicabilitétous les éléments
Héritéeoui
Médiavisuel
Valeur calculéecomme spécifié
Type d'animationdiscrète
Ordre canoniquel'ordre d'apparition dans la grammaire formelle des valeurs

Syntaxe

/* Syntaxe avec un mot-clé */
text-decoration-skip: none;
text-decoration-skip: objects;
text-decoration-skip: spaces;
text-decoration-skip: ink;
text-decoration-skip: edges;
text-decoration-skip: box-decoration

/* Plusieurs mots-clés */
text-decoration-skip: objects spaces;
text-decoration-skip: ink edges box-decoration;

/* Mots-clés globaux */
text-decoration-skip: inherit;
text-decoration-skip: initial;
text-decoration-skip: unset;

Valeurs

none
La propriété text-decoration s'applique à tous les éléments sélectionnés.
objects
La propriété text-decoration n'est pas appliquée pour les éléments en lignes atomiques telles que les images ou les blocs en lignes.
spaces
Les lignes décoratives ne sont pas appliquées pour les espacements. La propriété text-decoration n'est pas appliquée pour les caractères ayant la propriété White_Space et tous les séparateurs de mot ainsi que les letter-spacing or word-spacing adjacents.
ink
La propriété text-decoration n'est appliquée que lorsqu'elle ne touche pas un glyphe (ou qu'elle n'en est pas extrêmement proche).
An example of "text-decoration-skip: ink;".
edges
La décoration de text-decoration est rognée vers l'intérieur de la moitié de la largueur de la ligne, vers la droite et la gauche..
An example of "text-decoration-skip: edges;".
box-decoration
La propriété text-decoration n'est pas appliquée pour les marges, bordures et zones de remplissage (padding) des éléments fils.

Syntaxe formelle

none | [ objects || spaces || ink || edges || box-decoration ]

Exemples

CSS

p {
  margin: 0;
  font-size: 3em;
  text-decoration: underline;
  text-decoration-skip: ink;
}

HTML

<p>Bonjour tout le monde, quelle journée !</p>

Résultat

Spécifications

Spécification État Commentaires
CSS Text Decoration Level 3
La définition de 'text-decoration-skip' dans cette spécification.
Candidat au statut de recommandation Définition initiale.

Compatibilité des navigateurs

Fonctionnalité Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari
Support simple Pas de support[1] Pas de support[3] Pas de support[2] Pas de support Pas de support[1] Pas de support[4]
Fonctionnalité Android Chrome pour Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Support simple Pas de support[1] Pas de support[1] Pas de support[2] Pas de support Pas de support[1] Pas de support[4]

[1] Cette fonctionnalité n'est pas encore implémentée (cf. Chromium bug 477917).

[2] Cette fonctionnalité n'est pas encore implémentée (cf. bug 812990).

[3] Cette fonctionnalité n'est pas encore implémentée (cf. la demande associée).

[4] Safari implémente une version préfixée par -webkit pour cette propriété depuis la version 8 bien que celle-ci ne prenne en charge que la valeur none et la valeur non-standard skip. Toutes les autres valeurs qui pourraient être employées se comportent comme l'une des deux valeurs.

Étiquettes et contributeurs liés au document

 Contributeurs à cette page : SphinxKnight
 Dernière mise à jour par : SphinxKnight,