私は最近この状況を経験しましたが、「なぜ」を見つけることができませんか? 誰でも説明できますか?
以下の例を参照してください: http://codepen.io/chriscoyier/pen/lzjqh
私は最近この状況を経験しましたが、「なぜ」を見つけることができませんか? 誰でも説明できますか?
以下の例を参照してください: http://codepen.io/chriscoyier/pen/lzjqh
これはブラウザの制限が原因で発生し、仕様やブラウザの実装方法の誤りではありません。
仕様には次のように書かれています。
セレクターの特異性は次のように計算されます。
- セレクター内の ID セレクターの数を数える (= a)
- セレクター内のクラスセレクター、属性セレクター、疑似クラスの数を数える (= b)
- セレクター内の型セレクターと疑似要素の数を数える (= c)
- ユニバーサルセレクターを無視する
否定疑似クラス内のセレクターは、他のものと同様にカウントされますが、否定自体は疑似クラスとしてカウントされません。
3 つの数 abc を (基数が大きい数体系で) 連結すると、特異性が得られます。
ブラウザは、計算のために特定値を整数として保存する必要があり、ブラウザによっては値が 256 になると何らかの理由でオーバーフローが発生します。これは通常、最大値が 255 の 8 ビット符号なし整数で発生します。もう 1 つ追加すると、クラス レベルの特異性が何らかの形で ID レベルの値に「アップグレード」され、カスケード内の ID と等しくなり、それによってオーバーライドされます。
これはすべて記事で説明されています: