web-dev-qa-db-fra.com

Changer la couleur d'une image svg en utilisant CSS

J'ai l'image svg suivante dans mon fichier html:

<img class="svg" src="my-image-link.svg">

Maintenant, j'essaie de changer la couleur en utilisant ce code CSS:

.svg path {
    fill: black;
}

Cependant, rien ne change. Quelle est la bonne façon de changer la couleur du chemin d'une image svg en utilisant css? Merci!

htmlcsssvg
5
darkhorse

si vous utilisez le svg dans une balise d'image, il n'est pas possible de changer quoi que ce soit dans le SVG ...

pour ce faire, vous devez inclure l'intégralité du SVG en ligne ... regardez par exemple ici: link

4
FalcoB

Vous devez utiliser un SVG en ligne, où l'élément path se trouve à l'intérieur du HTML, par opposition à un lien vers un SVG externe.

Exemple: https://jsfiddle.net/fznuckb0/1/

.path-name {
    fill: tomato;
    fill-rule: evenodd;
}
4
rorymorris89