一个css属性值优先于另一个-Priorityofonecssattributevalueoveranother

For a button I have 3 possible classes: "state-normal", "state-focus" and "state-hover". All have the same attributes (background, border, ...), but different values for the attributes.
If a button gets "state-focus", I do not want to remove the class "state-normal".
If a button is "state-focus" and gets "state-hover", I do not want to remove the class "state-focus".
In the browser language specification you can give a "quality"/priority to a language:

对于一个按钮,我有3个可能的类:“state-normal”,“state-focus”和“state-hover”。所有属性都具有相同的属性(背景,边框,...),但属性的值不同。如果按钮变为“状态焦点”,我不想删除“state-normal”类。如果按钮是“状态焦点”并且获得“状态悬停”,我不想删除类“state-focus”。在浏览器语言规范中,您可以为语言提供“质量”/优先级:

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

It would be great to do the same also in css:

在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 }

I know that there is nothing in CSS.

我知道CSS中没有任何内容。

But, I know in jQuery UI they have kind of this, because they don't remove "ui-state-default" when they assign "ui-state-focus" to an element. How do they do it?

但是,我知道在jQuery UI中他们有这种情况,因为当他们将“ui-state-focus”分配给元素时,他们不会删除“ui-state-default”。他们是如何做到的呢?

Is there another way to implement this with a trick (WITHOUT !IMPORTANT).

有没有另一种方法来实现这个技巧(没有!重要)。

Thanks alot in advance

非常感谢提前

1 个解决方案

.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-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 }