La strokepropriété en CSS permet d'ajouter une bordure aux formes SVG.
.module ( stroke: black; )Rappelles toi:
- Cela va passer outre un attribut de présentation
- Cela ne remplacera pas un style en ligne, par exemple
Valeurs
La strokepropriété peut accepter n'importe quelle valeur de couleur CSS.
- Couleurs nommées -
orange - Couleurs hexagonales -
#FF9E2C - Couleurs RVB et RVBa -
rgb(255, 158, 44) and rgba(255, 158, 44, .5) - Couleurs HSL et HSLa -
hsl(32, 100%, 59%) and hsla(32, 100%, 59%, .5)
De manière assez géniale, strokeaccepte également les modèles de formes SVG qui sont définis à l'intérieur d'un defsélément:
.module ( stroke: url(#pattern); )Voir la propriété Pen stroke par CSS-Tricks (@ css-tricks) sur CodePen.
En rapport
fillstroke-dasharraystroke-dashoffsetstroke-linecapstroke-width
Plus d'information
- Spécifications SVG 1.1
- MDN sur les remplissages et les traits
Prise en charge du navigateur
| Chrome | Safari | Firefox | Opéra | C'EST À DIRE | Android | iOS |
|---|---|---|---|---|---|---|
| Oui | Oui | Oui | Oui | 9+ | 4.4+ | Oui |