我可以使用 CSS 更改 svg 路径的填充颜色吗?

2024-01-08

我有以下代码:

<span>
   <svg height="32" version="1.1" width="32" xmlns="http://www.w3.org/2000/svg" style="overflow: hidden; position: relative; left: -0.0166626px; top: -0.983337px;">
      <desc></desc>
      <defs/>
      <path style="" fill="#333333" stroke="none" d="M15.985,5.972C8.422,5.972,2.289999999999999,10.049,2.289999999999999,15.078C2.289999999999999,17.955,4.302999999999999...............1,27.68,22.274Z"/>
    </svg>
</span>

是否可以使用 CSS 或其他方式更改 SVG 路径的填充颜色,而无需在内部实际更改它<path> tag?


是的,您可以将 CSS 应用于 SVG,但您需要匹配元素,就像设置 HTML 样式一样。如果您只想将其应用于所有 SVG 路径,您可以使用,例如:

​path {
  fill: blue;
}​

外部 CSS 似乎覆盖了路径的fill属性,至少在我测试的基于 WebKit 和 Gecko 的浏览器中是这样。当然,如果你写,说,<path style="fill: green">那么它也会覆盖外部 CSS。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

我可以使用 CSS 更改 svg 路径的填充颜色吗? 的相关文章

随机推荐