我使用的平台在它自己的css中设置了fill属性:
.tatsu-svg-icon-custom svg * {
fill: currentColor;
}
在这种情况下，我要添加的SVG结果是black--这没有什么帮助.这个特定的SVG是一个多色SVG，它本身在SVG的代码中处理所有fill个属性.
显然，如果我将此属性更改为另一种 colored颜色 ，它会将整个SVG涂成该 colored颜色 -因此这也没有什么帮助.
所以我的问题是，我如何恢复默认设置，使其不会应用any色？将其设置为initial会使SVG变得透明.
在这种情况下，关键字是revert-layer.不幸的是，它目前只在Firefox中实现(>；=97).
(这个例子似乎也适用于其他浏览器.但这是因为对他们来说，这是一个无效的关键字.)
.tatsu-svg-icon-custom svg * {
fill: revert-layer;
}<div class="tatsu-svg-icon-custom">
<svg width="100" viewBox="0 0 20 20">
<circle r="5" cx="5" cy="5" fill="yellow" />
<circle r="5" cx="5" cy="15" fill="blue" />
<circle r="5" cx="15" cy="5" fill="red" />
<circle r="5" cx="15" cy="15" fill="green" />
</svg>
</div>