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 juillet 2020.
* Certaines parties de cette fonctionnalité peuvent bénéficier de prise en charge variables.
L'attribut stroke définit la couleur (ou n'importe quelle méthode de remplissage, comme un gradient ou motif) a utiliser pour dessiner le contour d'une forme SVG.
Note :
stroke étant un attribut de présentation, il peut être utilisé comme propriété CSS.
Cet attribut peut être appliqué à tout élément, en revanche il n'aura d'effet que sur les éléments suivants: <altGlyph>, <circle>, <ellipse>, <path>, <polygon>, <polyline>, <rect>, <text>, <textPath>, <tref>, and <tspan>
Exemple
<svg viewBox="0 0 20 10" xmlns="http://www.w3.org/2000/svg">
<!-- Simple trait de couleur -->
<circle cx="5" cy="5" r="4" fill="none" stroke="green" />
<!-- Utiliser un degradé comme contour -->
<defs>
<linearGradient id="myGradient">
<stop offset="0%" stop-color="green" />
<stop offset="100%" stop-color="white" />
</linearGradient>
</defs>
<circle cx="15" cy="5" r="4" fill="none" stroke="url(#myGradient)" />
</svg>
Notes d'usage
| Valeur | <paint> |
|---|---|
| Valeur par défaut | none |
| Animation | Oui |
Spécifications
| Specification |
|---|
| Scalable Vector Graphics (SVG) 2 # SpecifyingStrokePaint |
Compatibilité des navigateurs
Chargement…
Note :
Pour plus d'informations sur les valeurs de context-stroke (et context-fill) à partir de documents HTML, voir la documentation pour la propriété non-standard -moz-context-properties.