html中的颜色Svg元素[重复]

Posted 2023-03-06

【中文标题】html中的颜色Svg元素[重复]

【英文标题】：Color Svg elements in html [duplicate]

【发布时间】：2019-03-04 10:31:09

【问题描述】：

我在我的网站中使用 svg 图标，并且想将它们的颜色更改为红色（它们都是黑色的）。

<img src='assets/icon.svg'/>

我尝试在 img 标签上使用 css 填充属性，但它不起作用。 然后我遇到了对象 attr 并尝试使用 svg 图标，如下所示：

<object type="image/svg+xml" data="assets/icon.svg"></object>

在这里对对象应用填充属性什么都不做。关于如何在不使用 jquery 的情况下更改 svg 元素的填充属性的任何想法

jsfiddle

【问题讨论】：

编辑icon.svg文件，将文件中所有颜色改为红色。

您链接的小提琴正在使用 .png 图像文件。您无法更改代码中的颜色。

【参考方案1】：

您需要将填充颜色设置为 svg 路径

path 
    fill:red;

【讨论】：

无法通过直接将其添加到 css 文件来工作，而且我没有路径元素，我猜是在外部导入它时

你能分享一下工作代码sn-p吗？

我已经更新了问题

请在您使用过 png 文件的小提琴中使用 svg 文件。请用 svg 更新小提琴