使用CSS更改SVG图像的颜色

Question

我在页面上包含了一个svg图像，方法如下：

<img src="image.svg" class="arrow"/>

• 我想用CSS改变它的颜色。这可行吗？

- mheavers

---

我认为你需要使用文本编辑器编辑图像，并将其复制到HTML中以完成此操作。否则，您还可以使用非常不受支持的CSS属性“-webkit-filter”。 - noob

我想出了一个不错的方法来做这件事，我认为这是目前最好的方法： https://dev59.com/S2ct5IYBdhLWcg3wmOZN#11978996 - Drew Baker

Answer 1

虽然有 hue-rotate，但它目前还没有得到广泛支持。

- freejosh

---

谢谢 - 这真的很有用。我找到了一个不错的 jsfiddle，里面有一些可能适合我的属性 - http://jsfiddle.net/w3cplus/wThjx/ - mheavers

Answer 2

你无法这样做。如果你想把它做成一个鼠标滑过效果的图片，那么需要创建一个新的SVG图像，改变颜色并使用JavaScript代码 （请参考此代码） 来实现鼠标滑过效果。

如果你没有用它作为鼠标滑过效果的图片，那么我也无能为力了。

- Adam