-webkit-text-stroke
Baseline
Widely available
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis avril 2017.
La propriété CSS -webkit-text-stroke permet de définir la largeur et la couleur du contour des caractères du texte. Il s'agit d'une propriété raccourcie pour -webkit-text-stroke-width et -webkit-text-stroke-color.
Propriétés constitutives
Cette propriété est une propriété raccourcie pour les propriétés CSS suivantes :
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
HTML
html
<p id="exemple">Un texte avec un bordure</p>
CSS
css
#exemple {
font-size: 3em;
margin: 0;
-webkit-text-stroke: 2px red;
}
Résultat
Spécifications
| Specification |
|---|
| Compatibility # the-webkit-text-stroke |