用作背景图像时修改SVG填充颜色
将SVG输出直接与页面代码内联放置，我能够像这样简单地用CSS修改填充颜色：
polygon.mystar {
fill: blue;
}
circle.mycircle {
fill: green;
}
这很好用，但是我正在寻找一种方法，当它用作Background-IMAGE时，修改SVG的“填充”属性。
html {
background-image: url(../img/bg.svg);
}
现在如何更改颜色？可能吗
作为参考，这是我的外部SVG文件的内容：
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="320px" height="100px" viewBox="0 0 320 100" enable-background="new 0 0 320 100" xml:space="preserve">
<polygon class="mystar" fill="#3CB54A" points="134.973,14.204 143.295,31.066 161.903,33.77 148.438,46.896 151.617,65.43 134.973,56.679
118.329,65.43 121.507,46.896 108.042,33.77 126.65,31.066 "/>
<circle class="mycircle" fill="#ED1F24" cx="202.028" cy="58.342" r="12.26"/>
</svg>
问题答案：
一种方法是从某种服务器端机制为svg提供服务。只需创建一个资源服务器端，即可根据GET参数输出svg，然后将其提供给某个网址。
然后，您只需在CSS中使用该网址即可。
因为作为背景img，它不是DOM的一部分，因此您无法操纵它。另一种可能性是定期使用它，以常规方式将其嵌入页面中，但将其绝对定位，使其完全具有页面的宽度和高度，然后使用z-
index css属性将其置于所有其他DOM元素之后在页面上。
-
我有一个SVG作为div中的背景图像。当我通过JQuery添加一个类“svg”时，我想改变这个SVG的填充颜色。 我该怎么做呢？ 以下是我目前为止的代码: 谢谢 899年
-
如果我通过css背景图像加载SVG图像，如下所示： 如何更改图标内部形状或整个图标本身的填充颜色？ 谢谢。
-
问题内容： 是否可以为SVG 元素设置a ？ 例如，如果设置了element ，则CSS样式有效，但都不起作用。 问题答案： 您可以通过将背景变成图案来实现： 根据您的图像调整宽度和高度，然后从这样的路径中引用它：
-
我想为svg（莲花）使用不同的颜色。让我们说一个绿色的盒子命名为TOPS，红色的Rest室，白色的其余部分。我想通过css设置颜色。 svg在css中被引用为背景图像： 背景图片： 网址（“https://cdn.shopify.com/s/files/1/1011/6932/t/20/assets/lotos.svg?14455316687248826498”）; 我如何才能做到这一点？
-
如何设置内联/背景 SVG 的填充颜色（使用 CSS）？
-
问题内容： 假设我要在CSS中渲染箭头，箭头应具有头部，尾部和灵活的宽度，以便可以包含文本。我当然可以创建多个div来获得所需的内容，但是如何在CSS3中完成呢？ 我可以使用多个背景图片： 的HTML： 这给了我一个带有箭头和尾巴的透明中间部分。似乎不可能在中间部分指定颜色。 仅使用一张背景图像，您可以执行以下操作： 我知道这在很多方面都是可行的，但是背景颜色属性是否真的从速记定义中丢失了？ 问题