一个css属性值优于另一个cs属性值

Question

对于一个按钮，我有3个可能的类：“state-normal”，“state-focus”和“state-hover”。 所有元素具有相同的属性（背景，边框，...），但 属性的值不同。
如果一个按钮获得“状态焦点”，我不想删除类“状态正常”。
如果一个按钮是“状态焦点”并获得“状态悬停”，我不想删除类“ ”状态焦点“。
在浏览器中的语言规范，你可以给一个“质” /优先语言：

"Accept-Language: da, en-gb;q=0.8, en;q=0.7" 

这将是巨大的，做同样也在CSS：

.state-normal { background-color: #aaaaaa;q=0.5 } 
.state-focus { background-color: #bbbbbb;q=0.7 } 
.state-hover { background-color: #eeeeee;q=0.9 } 

我知道，有在CSS中什么也没有。

但是，我知道在jQuery UI中他们有这样的一种，因为他们在向一个元素赋值“ui-state-focus”时不会删除“ui-state-default”。他们是如何做到的呢？

是否有另一种方法来实现这个技巧（无！重要）。

非常感谢

Answer 1

您可以使用CSS来做到这一点。

.state-normal { background-color: #aaaaaa;q=0.5 } 
.state-normal.state-focus { background-color: #bbbbbb;q=0.7 } 
.state-focus.state-hover { background-color: #eeeeee;q=0.9 } 

但这意味着在规则中提及的所有的类将存在，即，一个元件将具有两个类存在。因此，类state-focus的元素将不会按照规则设置背景颜色。

如果你想避免这种情况，那么你就可以做到这一点，而不是：

.state-normal { background-color: #aaaaaa;q=0.5 } 
.state-focus, .state-normal.state-focus { background-color: #bbbbbb;q=0.7 } 
.state-hover, .state-focus.state-hover { background-color: #eeeeee;q=0.9 } 

---

编辑：由于每个操作的要求

CSS Specificity

CSS Selectors - MDN

Similar answer