22

根据 CSS 文档: http ://www.w3.org/TR/CSS21/cascade.html#specificity

特异性由(除其他外)选择器中属性和伪类的数量定义。

所以,我的问题是,是否可以通过一遍又一遍地重复相同的类名来增加特异性?

例如:

.qtxt.qtxt.qtxt.qtxt.qtxt
{
}

具有更高的特异性

.qtxt.lalgn
{
}

或者

.lalgn .qtxt//(space added to create child selector)
{
}

?

4

3 回答 3

31

是的,这是可能的,也是有意的。虽然 CSS2 规范中没有提到这一点,但Selectors 3 规范中明确提到了这一点:

注意:同一简单选择器的重复出现[原文如此]是允许的,并且确实增加了特异性。

因此浏览器在遇到重复的简单选择器时必须增加特异性,只要选择器有效且适用。这不仅适用于重复的类,也适用于重复的 ID、属性和伪类。

给定您的代码,.qtxt.qtxt.qtxt.qtxt.qtxt将具有最高的特异性。其他两个选择器同样具体;组合器根本与特异性计算无关:

/* 5 classes -> specificity = 0-5-0 */
.qtxt.qtxt.qtxt.qtxt.qtxt

/* 2 classes -> specificity = 0-2-0 */
.qtxt.lalgn

/* 2 classes -> specificity = 0-2-0 */
.lalgn .qtxt

此外,最后一个选择器中的空格是后代组合器;子组合器>.

于 2012-07-20T14:11:25.433 回答
1

.qtxt.qtxt.qtxt将具有最高的特异性...

http://jsfiddle.net/nXBTp/1/

但是,仅当您将类名重复次数多于任何其他选择器时,才会出现这种情况,例如:

http://jsfiddle.net/nXBTp/2/

于 2012-07-20T04:26:00.120 回答
-6

您不需要像这样破解特异性......如果您需要强制一个值,请使用!important.

于 2012-07-20T02:38:23.473 回答