L'attribut stroke-width définit l'épaisseur du contour à appliquer à une forme SVG.

Note: stroke-opacity étant un attribut de présentation, il peut être utilisé comme propriété CSS.

Cet attribut peut être appliqué à tous les éléments, en revanche il n'aura d'effet que sur les éléments suivants: <altGlyph>, <circle>, <ellipse>, <path>, <polygon>, <polyline>, <rect>, <text>, <textPath>, <tref>, et <tspan>

<svg viewBox="0 0 30 10" xmlns="http://www.w3.org/2000/svg">
  <!-- Épaisseur par défaut: 1 -->
  <circle cx="5" cy="5" r="3" stroke="green" />

  <!-- Définit l'épaisseur avec un nombre -->
  <circle cx="15" cy="5" r="3" stroke="green"
          stroke-width="3" />

  <!-- Définit l'épaisseur avec un pourcentage -->
  <circle cx="25" cy="5" r="3" stroke="green"
          stroke-width="2%" />
</svg>

Notes d'usage

Valeur <length> | <percentage>
Valeur par défaut 1px
Animation Oui

Note: SVG2 introduit les valeurs en pourcentage pour stroke-width, Cependant, ce n'est pas souvent pris en charge pour le moment (voir Compatibilité des navigateurs ci-dessous). Il est par conséquent recommandé d'utiliser les valeurs de l'intervalle [0-1].

Une valeur en pourcentage est toujours calculée en tant que pourcentage de la longueur diagonale viewBox normalisée.

Compatibilité des navigateurs

Update compatibility data on GitHub
OrdinateurMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariWebview AndroidChrome pour AndroidEdge MobileFirefox pour AndroidOpera pour AndroidSafari pour iOSSamsung Internet
Support simpleChrome ? Edge ? Firefox ? IE ? Opera ? Safari ? WebView Android ? Chrome Android ? Edge Mobile ? Firefox Android ? Opera Android ? Safari iOS ? Samsung Internet Android ?

Légende

Compatibilité inconnue  
Compatibilité inconnue

Spécification

Spécification Statut Commentaire
Scalable Vector Graphics (SVG) 2
La définition de 'stroke-width' dans cette spécification.
Candidat au statut de recommandation

Définition pour les formes et le texte

 

Scalable Vector Graphics (SVG) 1.1 (Second Edition)
La définition de 'stroke-width' dans cette spécification.
Recommendation Définition initiale pour les formes et le texte

Étiquettes et contributeurs liés au document

Étiquettes : 
Contributeurs à cette page : a-mt
Dernière mise à jour par : a-mt,