如何覆盖已应用！important的内置样式

Question

我试图通过复制相同的CSS来覆盖这种样式

[class^="icon-"], [class*=" icon-"] {
        font-family: 'SilkWeb4' !important;
        font-style: norm} 

尝试过

[class^="icon-"], [class*=" icon-"] {
            font-family: arial !important;
            font-style: norm} 

而不是SilkWeb4应用了arial！important;结果仍然没有运气。 有没有方法可以覆盖这个？

Answer 1

应用更精确的选择器。您可能根本不需要使用！important：

https://css-tricks.com/when-using-important-is-the-right-choice/

https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

Answer 2

使用ID可以增加特异性。 :not()中的随机ID可以完成这项工作：

[class^="icon-"]:not(#randomID), [class*=" icon-"]:not(#randomID) {
        font-family: arial !important;
        font-style: normal
} 

Answer 3

而不是复制，您为什么不只替换字面上的一个字呢，没有冒犯您的问题是绝对有效的，那只是一个建议。使用这个：

[class^="icon-"]:not(#randomID), [class*=" icon-"]:not(#randomID) {
    font-family: arial !important;
    font-style: normal

}

@Temani Afif提供的代码正确