如何清除CSS中已设置的fill属性，恢复多色SVG默认样式？

平台的.tatsu-svg-icon-custom svg * { fill: currentColor; }规则会强制覆盖SVG内部所有元素的填充色，导致自带多色的SVG失效。以下是可行的解决方法：

• 方法一：用revert恢复SVG自身颜色
  给你的多色SVG添加一个专属类（比如preserve-original-colors），然后添加自定义CSS规则：

  .tatsu-svg-icon-custom .preserve-original-colors svg * {
    fill: revert;
  }
  

  revert会让元素放弃当前自定义的CSS规则，恢复到浏览器默认的样式逻辑——也就是优先使用SVG自身定义的fill属性值，而非强制继承currentColor。

• 方法二：用unset取消强制继承
  如果revert在部分旧浏览器不生效，可以改用unset：

  .tatsu-svg-icon-custom .preserve-original-colors svg * {
    fill: unset;
  }
  

  unset会让继承属性恢复继承行为，非继承属性恢复初始值，这样SVG内部自带的fill设置就能正常生效。

• 方法三：确保SVG自身的fill属性明确
  打开SVG文件，检查每个带自定义颜色的元素是否都明确设置了fill属性（不要依赖默认值），再配合上面的CSS规则覆盖平台样式，能进一步避免样式冲突。

为什么initial会导致透明？因为CSS中fill的初始值是currentColor，如果SVG元素本身未设置fill，且父级的currentColor被隐式设置为透明，就会显示透明状态。而revert/unset能正确让SVG自身的fill设置优先生效。

内容的提问来源于stack exchange，提问作者Brett