CSSカスケーディング - さらに回線がオーバーライドしてはいけませんか？

Question

私はあなたがさらにスタイルシート下のCSSのコードの行を置けば、それはのような、より重要であると認識すべきであるという印象の下にあった：

.border { のborder-right：1pxの固体#FFF; }

.no-border { border-right：none; }

第1クラスを上書きしないでください。これはプロジェクトでは起こっていないし、理由を理解していないのですか？

おかげで

Answer 1

目安として、最後のルールは重要なルールです。

しかし、これは多くのシナリオではそうではありません。 CSS Specificityにお読みください。

等しい特異性：最新のルールは重要なルールです。 "外部のスタイルシートに同じルールを2回書いたのであれば、スタイルシートの下位のルールがスタイルする要素に近いほど、より具体的であるとみなされ、適用されます。

セレクタは、両方のルールは特異0、1、0、1を持っている、後者のルールが常に適用される

#content h1 { padding: 5px;} 
#content h1 { padding: 10px;} 

として同じ特異値を有します。

不一致の特異性：より具体的なルールは重要なルールです。 "セレクタには1つ以上の参照点を含めることができますが、これらの参照点の特異度格付けが大きくなるほど、ルールがより具体的になります。ブラウザーは、表示する最も具体的なルールを選択します。

Answer 2

はい、それはそれは使ってみて、同じクラス名を持っている場合のみです！重要代わりに

Answer 3

を使用すると、カスケード順序のルールを以下のしていることを確認します。言い換えれば、どのようにルールを定義している場合は、を上書きする可能性があります。ルールを定義しています。

このサイトでは、それをすべて説明する必要があります：

http://www.blooberry.com/indexdot/css/topics/cascade.htm

はEDIT：おっと。あなたの例では、1つのクラスを同じ名前のクラスでオーバーライドしていません。問題でもあります。

Answer 4

です。

ルールの特異性が同じ場合は、後で指定するルールが優先されます。

コードの実際の動作をご確認ください。http://jsfiddle.net/JSJM9/1/