Fatal编程技术网
  • html/
  • Html 仅使用CSS为SVG着色？

Html 仅使用CSS为SVG着色？

html css svg

Html 仅使用CSS为SVG着色？,html,css,svg,Html,Css,Svg,我经历了无数次的尝试，试图在不改变实际文件属性的情况下，直接通过CSS为SVG上色。 我正在尝试用新颜色填充CSS中的SVG，但我无法让它工作 在object元素中定位SVG元素似乎与googlechrome的Inspector中的CSSfill:red属性一起工作，但是在代码中执行同样的操作并没有任何作用 原始SVG文件没有任何填充属性 如果有人能告诉我对此能做些什么，那就太棒了，假设您使用的是SVG的内容，而不仅仅是图像/对象： 我也经历过和你一样的过程，浪费了很多天去想办法解决这个问题。几

我经历了无数次的尝试，试图在不改变实际文件属性的情况下，直接通过CSS为SVG上色。 我正在尝试用新颜色填充
CSS
中的
SVG
，但我无法让它工作

在object元素中定位SVG元素似乎与googlechrome的Inspector中的CSS
fill:red
属性一起工作，但是在代码中执行同样的操作并没有任何作用

原始SVG文件没有任何填充属性

如果有人能告诉我对此能做些什么，那就太棒了，假设您使用的是SVG的内容，而不仅仅是图像/对象

：

我也经历过和你一样的过程，浪费了很多天去想办法解决这个问题。几个月后，我发现有一个简单的属性可以放在文件上实现这一点。我知道你说过你不想更改文件，所以如果你不想，你可以使用我做的肮脏伎俩，即使用javascript取出SVG的内容，创建一个新的
div
，并将内容放在其中

但是，如果可以稍微修改该文件，则可以添加：

fill="currentColor"
然后它就会变成它祖先的颜色

<svg ...>
    <path fill="currentColor" ... />
</svg>
您不能使用页面的CSS格式化SVG图像中的元素，这些元素通过
对象
或
img
嵌入到文档中-SVG元素需要直接成为文档的一部分。