尖沙咀の最終決定権を持っているのは誰ですか? ！ - CSS cascading_html/css_WEB-ITnose

数日前、私の友人がこの CSS を送ってきました。

そうです

Q: どの色ですか?
A: #000ですね?

なんてことだ！ ！ 結果は #fff です。ページボーイとして私はそれを表現します。 。 。
練習した後、私は彼らのルールをマスターしました。

たくさんある CSS ルールの中でどれが効果的ですか?これは実際には、特殊性 (重要性)、重要性、継承の 3 つの要素によって決まります。

特殊性

簡単に言うと、ブラウザが各 CSS ルールの前でセレクターに与えるスコアです。スコアが高いほど、適用される可能性が高くなります。

例:

div{....} vs #name{}
ここでの #name の特異性は div の特異性よりも高くなります。
どうやって比較するの？
スペシャルティは、0,0,0,0 のように 4 つの部分に分かれています。

HTML に埋め込まれた属性、1,0,0,0 を追加します。例:

ID セレクター、0,1,0,0 を追加します。例: #id{}

クラス セレクター、属性セレクターまたは疑似クラス、0,0,1,0 を追加します。例:[href]{} または: hover{}

要素または疑似セレクタ、0,0,0,1; 例:div{} または:after{}

結合子と * は追加されません。例: * > * {}

Chestnut Two

h1 {} /* 0,0,0,1 */

p em {} /* 0 ,0,0,2 */

p.ahole {} /* 0,0,1,1 */

p.ahole em.chan {} /* 0,0,2,2 */

# ahole div{} /* 0,1,0,1 */

p * [href] {} /* 0,0,1,1 */

最初に高い位置を比較し、次にステータスを比較します。 h1 の特徴と Xiaoyu p em の特殊性。

重要性

重要性は実際には存在するかどうかにあります！重要です。はい！重要なことは何もないよりも高度です。

//css   *{        color:#fff ;    }        div{        color:#000 !important;    }//html        <div><span>I am ahole</span></div>    

結果が出て、div が勝ちました

ahole: 理由は、私の特別性は比較的高いです。

div: ふふふ、私のお父さんは ！重要。

ahole: ....

この物語は、そうです!一番大事なのは丹生×です。

継承

スタイルの継承、誰もが理解していると思うので、冗長になります。
ただし、最初のデモを見てみましょう。注意すべきことが 1 つあります。
なぜ両方なのですか！大切でも勝てない。
その理由は、継承には特別な特徴がないからです。つまり、0,0,0,0 よりも低くなります。
最初のデモでは、span には 2 つのルールから選択できます。1 つは特異性が非常に低いワイルドカードで、もう 1 つは特異性が高いワイルドカードです。重要。公平を期すためには後者が勝つはずですが、後者のルールは継承されることを忘れないでください。これは彼が継承されたため、それでもワイルドカードに負けたためです。 （それを受け継いだ者には他者と競争する資格すらない。2333）。

スタッキング

スタッキング: 最終結果を得るために、上記の 3 つのルールを重ね合わせるプロセスです。
プロセスは大まかに次のとおりです:
1. まず、使用できる CSS ルールを選択します。
2. 選択したルールが継承されるかどうかを判断します。はい？
3 があるかどうかを確認してください。重要。いいえ？飛び越える。持っている？ VIP は留まっても留まっても、それ以外は排除されます。
4. 比較的具体的。特異性の高いものはそのままにしておきます。
5. 後から現れた方が勝ちです。 (どれも素晴らしいですよね? もちろん、小さいものを選んでください。)
注意: 上記の各ステップでルールが 1 つだけ残っている限り、審査は終了します。

お読みいただきありがとうございます。何か間違っている点がございましたら、メッセージを残してください。ハイハン！