使用 CSS 更改 svg 图像的颜色 [重复]

Posted 2023-03-06

技术标签:

【中文标题】使用 CSS 更改 svg 图像的颜色 [重复]【英文标题】：Changing the color of an svg image using CSS [duplicate] 【发布时间】：2017-03-13 14:31:53 【问题描述】：

我的 html 文件中有以下 svg 图片：

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

现在，我正在尝试使用此 css 代码更改颜色：

.svg path 
    fill: black;

但是，没有任何变化。使用 css 更改 svg 图像路径颜色的正确方法是什么？谢谢！

【问题讨论】：

【参考方案1】：

如果您在图像标签中使用 svg，则无法更改 SVG 中的任何内容...

为此，您必须将整个 SVG 内联包含在内...例如：link

【讨论】：

【参考方案2】：

您必须使用内联 SVG，其中路径元素位于 HTML 内部，而不是链接到外部 SVG。

示例：https://jsfiddle.net/fznuckb0/1/

.path-name 
    fill: tomato;
    fill-rule: evenodd;

【讨论】：

以上是关于使用 CSS 更改 svg 图像的颜色 [重复]的主要内容，如果未能解决你的问题，请参考以下文章