-webkit-text-stroke
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since avril 2017.
La propriété -webkit-text-stroke permet de définir l'épaisseur et la couleur du contour utilisé pour les lettres d'un texte. Cette propriété est une propriété raccourcie qui permet de définir les propriétés -webkit-text-stroke-width et -webkit-text-stroke-color.
Syntaxe
css
/* Valeurs de largeur et de couleur */
-webkit-text-stroke: 4px navy;
/* Valeurs globales */
-webkit-text-stroke: inherit;
-webkit-text-stroke: initial;
-webkit-text-stroke: revert;
-webkit-text-stroke: revert-layer;
-webkit-text-stroke: unset;
Valeurs
Définition formelle
| Valeur initiale | pour chaque propriété individuelle de la propriété raccourcie :
|
|---|---|
| Applicabilité | tous les éléments |
| Héritée | oui |
| Valeur calculée | pour chaque propriété individuelle de la propriété raccourcie :
|
| Type d'animation | pour chaque propriété individuelle de la propriété raccourcie :
|
Syntaxe formelle
-webkit-text-stroke =
<line-width> ||
<color>
<line-width> =
<length [0,∞]> |
thin |
medium |
thick
Exemples
Ajouter un contour rouge au texte
CSS
css
#exemple {
font-size: 3em;
margin: 0;
-webkit-text-stroke: 2px red;
}
HTML
html
<p id="exemple">Le contour de ce texte est rouge.</p>
Résultat
Spécifications
| Specification |
|---|
| Compatibility # the-webkit-text-stroke |
Compatibilité des navigateurs
Loading…