Propriété CSS stroke-width
La propriété CSS stroke-width spécifie spécifie la largeur du contour de l'élément.
Les unités "px" ou "em" ne sont pas demandés.
Valeur initiale | 1 |
Appliquée à | Formes et éléments de contenu de texte. |
Héritée | Oui. |
Animable | Non. |
Version | SVG 1.1 Specification |
Syntaxe DOM | Object.strokeWidth = "0.5"; |
Syntaxe
stroke-width: length | percentage | initial | inherit;
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Titre du document</title>
</head>
<body>
<h2>Exemple de la propriété stroke-width</h2>
<svg viewBox="0 0 30 10">
<circle cx="5" cy="5" r="3" stroke="#1c87c9"
stroke-width="1" />
</svg>
</body>
</html>
Voyez un autre exemple de la propriété stroke-width:
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Titre du document</title>
</head>
<body>
<h2>Exemple de la propriété stroke-width</h2>
<svg viewBox="0 0 30 10">
<circle cx="5" cy="5" r="3" stroke="#1c87c9"
stroke-width="3" />
</svg>
</body>
</html>
Dans cet exemple la largeur du contour est définie comme un pourcentage:
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Titre du document</title>
</head>
<body>
<h2>Exemple de la propriété stroke-width</h2>
<svg viewBox="0 0 30 10">
<circle cx="5" cy="5" r="3" stroke="#1c87c9"
stroke-width="2%" />
</svg>
</body>
</html>
Valeurs
Valeur | Description |
---|---|
length | Spécifie la largeur du contour. |
percentage | Spécifie la largeur du contour en %. |
initial | Fait utiliser la valeur initiale. |
inherit | Hérite la propriété de son élément parent. |
Support de Navigateurs
✓ | ✓ | ✓ | ✓ | ✓ |
Pratiquez vos connaissances
Qu'est-ce que CSS stroke-width est utilisé pour en CSS?
Correcte!
Incorrecte!