我想通过内容属性
bootstrap-style将SVG图像用作CSS sprite,如下所示：
i.rectangle-image {
content: url(rectangle.svg);
}
这是我的SVG：
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"> <rect x="10" y="10" width="80" height="80"/> </svg>
并建议HTML：
<div><i class="rectangle-image"></i> Hello,world!</div>
我希望能够在我的应用程序中重新着色SVG,例如让某些位置的图标显示为紫色,而其他位置显示为白色.我知道我可以通过在< rect>上设置三个不同的SVG文件(或数据URI)来完成此操作,其中fill属性设置不同.标签,但我想知道是否有办法通过我的HTML中的CSS来实现这一点？
我已经尝试将填充属性添加到i.rectangle-image选择器,但这不起作用.
我看过this answer,这不是我想要的.他们建议在整个页面中嵌入SVG,如果可能的话,我宁愿通过CSS内容来实现.有什么想法吗？我运气不好吗？
