2

ルールの優先順位については、たくさんの質問と回答があります。ここでの質問は、ブラウザによる同じルール内の CSS プロパティの実行に関するものです。

直感的に、ルールのプロパティはブラウザーによって順番に実行されると常に考えてきました。

例えば、

  #somediv {
    margin:0;
    margin-bottom:10px;
  }

私が使用するブラウザ（最近のChrome、FF、およびSafari、基本的に）では（margin:0 0 10px 0;決して）レンダリングされません。margin:0;つまり、2 番目のプロパティmargin-bottomは前のプロパティをオーバーライドしmarginます (すべてのマージンを に設定します0)。

しかし、すべてのブラウザー (IE、私はあなたを見ています) で、これが常に真実であると考えることができますか?

4

5 に答える 5

5

はい、これは予期される動作であり、CSSのカスケードの一部です。margin省略形のコンポーネントの 1 つを個々のmargin-bottom値でオーバーライドしているだけです。

短縮宣言全体を完全に消去するわけではないことに注意してください。margin上記の省略形は、次のいずれかに書き換えることができることを覚えておいてください。

margin: 0 0 0 0;

またはこれ：

margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;

したがってmargin-bottom: 10px、単に上記をオーバーライドしますmargin-bottom。

IE6 以前では!important、同じルール内の宣言が優先されないことにも注意してください (ただし、別のルールでは優先されます)。しかし、これは古いブラウザなので、正直なところあまり心配する必要はありません。この基本的なルールは明確に定義され、15 年以上変更されていないため、ブラウザはこれを正しく実装するための十分な時間があり、IE を含め、それをごまかす言い訳はありません。

于 2012-10-29T07:08:30.787 に答える
3

はい、これはw3c 仕様による正しい動作です。

2 つの宣言の重みが同じ場合...後者の指定が優先されます

あなたの例margin-bottomでは、10pxに設定されます。

レンダリング エンジンは、同じ特異性プロパティ値がどこから来るかを実際には気にしません (例のように同じルール内に設定されているか、同じセレクターまたは異なるセレクターを持つ 2 つのルール内に設定されている可能性があります)。2 つの宣言の計算された重みが同じ場合、後者が優先されます。

<style>
  .container span {color:red;}
  .content span {color:blue;}
  div .inner {color:green;}
  p a {color:orange;}    
</style>
<div class="container">
  <p class="content">
    <a href="#" class="button"><span class="inner">Hello world!</span></a>
  </p>
<div>

テキストは何色でレンダリングされますか? 最初の 3 つのルールは特定性が同じなので、"Hello world!" です。緑でレンダリングされます。ただし、省略形のプロパティを使用すると、これはさらに難しくなります。

于 2012-10-29T07:10:50.387 に答える
2

はい、2 つの同じプロパティを宣言しているが、ブラウザーとは異なる値を宣言している場合、プロパティの最後に宣言された値が取得されます。

たとえば、これを使用している場合

div {
   background-color: #ff0000; /*Red*/
   background-color: #00ff00; /*Green*/
}

最後に宣言されているため、ブラウザは緑を選択します

于 2012-10-29T07:08:44.760 に答える
1

ええ、あなたが書いた行の順序を変更すると、後に書かれたものは常に前のものを上書きします.ur rerultは元に戻され、2行目は常に最初の行になります。したがって、2つ以上のcssファイルがある場合は、 diff css の同じ要素に sme スタイリングを適用しないでください。そうしないと、含まれている css ファイルの順序に応じて、奇妙な css 出力が得られます。

于 2012-10-29T11:24:17.947 に答える
1

はい.. css プロパティは、すべてのブラウザにロードされた順序で上書きされます

于 2012-10-29T07:09:01.643 に答える