如何从CSS样式中排除具有fill属性的SVG

Question

在我的项目开始时，我添加了此全局css规则

svg {
    color: inherit;
    fill: currentColor;
} 

设置我所有SVG的填充量。现在，我添加了一个jQuery rating plugin，它可以与SVG一起使用，并使用fill属性为星星上色。但是由于上面的代码，星星始终是黑色的。我没有删除此规则并将其分别应用于每个SVG，而是将代码更改为以下

svg:not([fill]) {
    color: inherit;
    fill: currentColor;
}  

，它工作正常，但是我不确定这是否是not()选择器的好用例。是标准吗？
任何其他想法都欢迎。

Answer 1

您正在匹配任何没有fill属性的SVG元素。 not()伪类表示do not match a list of selectors的元素。该规则也会影响其他SVG元素。

您还可以为SVG分配一个类。

svg.mysvg {
  color: inherit;
  fill: currentColor;
}