有没有办法在 CSS 中退回到非伪 class 风格？

Question

如果我有一个蓝色 div 别人拥有

的代码

.stuff {
  background-color: blue;
}

我希望它在悬停时显示为红色

.stuff:hover {
  background-color: red;
}

但是我希望能够添加一个 class 让它回到它的非伪 class 状态：

.stuff.otherclass:hover {
  background-color: unset; /* Want blue in this case */
}

是否有 CSS 回到伪 class 前状态的选项？

Answer 1

回滚级联的唯一方法是使用 revert 关键字，但它会回滚到另一个来源。

无法在output of the cascade become the cascaded value中获得第2个值，忽略获胜者。

相反，您可以修改选择器并使用 :not() 伪 class:

.stuff {
  background-color: blue;
}
.stuff:not(.otherclass):hover {
  background-color: red;
}

或者，利用 .stuff.otherclass:hover 比 .stuff:hover

更具体

.stuff, .stuff.otherclass:hover {
  background-color: blue;
}
.stuff:hover {
  background-color: red;
}

Is there a way to fall back to a non-pseudo-class style in CSS?