SVG
utilisation
Recherche…
Paramètres
| Paramètre | Détails |
|---|---|
| X | Coordonnée de l'axe des x du coin supérieur gauche |
| y | coordonnée sur l'axe des y du coin supérieur gauche |
| largeur | largeur de l'élément <use> |
| la taille | hauteur de l'élément <use> |
| xlink: href | identifiant de ressource (fait référence à l'identifiant d'un autre élément) SVG 2 propose de le désapprouver et de le remplacer par un simple attribut href |
Remarques
Des détails peuvent être trouvés dans la Recommandation W3C pour SVG ainsi que la nouvelle Recommandation de candidat pour SVG2
Utiliser une icône
L'élément <use> est souvent utilisé pour les icônes réutilisables, en collaboration avec l'élément <symbol> . Cela ressemble à ceci:
<svg>
<symbol viewBox="0 0 16 16" id="icon-star">
<path d="M16 6.216l-6.095-.02L7.98.38 6.095 6.196 0 6.215h.02l4.912 3.57-1.904 5.834h.02l4.972-3.59 4.932 3.59-1.904-5.815L16 6.215" />
</symbol>
</svg>
Et l'élément <use> :
<svg>
<use xlink:href="#icon-star"/>
</svg>
L'élément <use> copie le <symbol> et l'affiche. Vous pouvez également remplacer les styles du <symbol> sur des éléments <use> individuels, par exemple
<style>
.red {
fill: red;
}
</style>
<svg>
<use class="red" xlink:href="#icon-star"/>
</svg>
Modified text is an extract of the original Stack Overflow Documentation
Sous licence CC BY-SA 3.0
Non affilié à Stack Overflow