15

どのセレクターが強いですか?

#nav li.current

また

div #nav li

そして2番目

a.test

また

.test .test

答えは何ですか?

4

2 に答える 2

36

仕様から:

セレクターの特異性は次のように計算されます。

  • セレクター内の ID セレクターの数を数える (= a)
  • セレクター内のクラスセレクター、属性セレクター、疑似クラスの数を数える (= b)
  • セレクター内の型セレクターと疑似要素の数を数える (= c)
  • ユニバーサルセレクターを無視する

否定疑似クラス内のセレクターは、他のものと同様にカウントされますが、否定自体は疑似クラスとしてカウントされません。

3 つの数 abc を (基数が大きい数体系で) 連結すると、特異性が得られます。

例:

*               /* a=0 b=0 c=0 -> specificity =   0 */
LI              /* a=0 b=0 c=1 -> specificity =   1 */
UL LI           /* a=0 b=0 c=2 -> specificity =   2 */
UL OL+LI        /* a=0 b=0 c=3 -> specificity =   3 */
H1 + *[REL=up]  /* a=0 b=1 c=1 -> specificity =  11 */
UL OL LI.red    /* a=0 b=1 c=3 -> specificity =  13 */
LI.red.level    /* a=0 b=2 c=1 -> specificity =  21 */
#x34y           /* a=1 b=0 c=0 -> specificity = 100 */
#s12:not(FOO)   /* a=1 b=0 c=1 -> specificity = 101 */
于 2013-10-01T13:45:17.767 に答える
10

次のルールに従って、セレクターをポイントとして計算できます。

タグ セレクターは 1 ポイントの価値があります。

クラスセレクターは 10 ポイントの価値があります。

ID セレクターは 100 ポイントの価値があります。

インライン スタイルは 1,000 ポイントの価値があります。

#nav li.current= 100 + 1+10 = 111

div #nav li= 1 + 100 + 1 = 102

a.test= 1+10 = 11

.test .test= 10+10 = 20

于 2013-10-01T13:50:35.173 に答える