A レンダリング効果 最初は、要素内のクラス名の順序を変更すると、レンダリング効果がクラス名の順序に従って順次レンダリングされるのではないかと考えていました。 コード <スタイル>"/> A レンダリング効果 最初は、要素内のクラス名の順序を変更すると、レンダリング効果がクラス名の順序に従って順次レンダリングされるのではないかと考えていました。 コード <スタイル>">

ホームページ >ウェブフロントエンド >htmlチュートリアル >cssクラスセレクターのクラス名オーバーライド優先インスタンスの詳細説明

cssクラスセレクターのクラス名オーバーライド優先インスタンスの詳細説明

零下一度
零下一度オリジナル
2017-06-24 13:47:562351ブラウズ
  • コード

    <style>
       .a{
      background: red;
       }
       .b{
      background: yellow;
       }
    </style>
    <div class="a b">A</div>
  • レンダリング効果
    cssクラスセレクターのクラス名オーバーライド優先インスタンスの詳細説明

    最初は、要素内のクラスクラスのクラス名の順序を変更すると、レンダリング効果は要素の順序に従って順番にレンダリングされると考えていました。クラス名

  • コード

    <style>
       .a{
      background: red;
       }
       .b{
      background: yellow;
       }
    </style>
    <div class="b a">A</div>
  • レンダリング効果
    cssクラスセレクターのクラス名オーバーライド優先インスタンスの詳細説明

    要素クラス内のクラス名の順序を変更しても、レンダリング順序には影響しません

  • コード

       <style>
       .b{
      background: yellow;
       }
       .a{
      background: red;
       }
       </style>
    <div class="a b">A</div>
  • レンダリング効果
    cssクラスセレクターのクラス名オーバーライド優先インスタンスの詳細説明

    スタイルシート内のクラスの順序を変更する レンダリング順序に影響します

    結論: 2 クラス内の同じ属性の適用順序は、CSS スタイルシートの下から上になります

以上がcssクラスセレクターのクラス名オーバーライド優先インスタンスの詳細説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。