ホームページ  >  記事  >  ウェブフロントエンド  >  CSSはどのようにしてスタイルを継承できないのでしょうか?

CSSはどのようにしてスタイルを継承できないのでしょうか?

藏色散人
藏色散人オリジナル
2020-12-17 10:28:374058ブラウズ

スタイルを継承しない CSS の実装方法: まず対応するコード ファイルを開き、次にスタイルを上書きクリアし、変更が難しいスタイル部分を抽出し、最後にそれを別のモジュールに適用します。組み合わせた方法で行うことができます。

CSSはどのようにしてスタイルを継承できないのでしょうか?

このチュートリアルの動作環境: Windows7 システム、CSS3 バージョンこの方法は、すべてのブランドのコンピューターに適しています。

推奨: "css ビデオ チュートリアル "

CSS の継承: 親にいくつかのプロパティを設定し、子は親のプロパティを継承します。 CSSで継承するものです。公式に説明すると、継承とは、スタイルを特定の HTML タグ要素だけでなく、その子孫要素にも適用できるようにするルールです。

親要素のスタイルを継承する CSS が面倒になる場合があります。継承されたスタイルをクリアする方法はありますか? CSS がスタイルを継承しないようにするにはどうすればよいですか?

現在、スタイルは上書きによってのみクリアできます。

CSS を記述する際には、この問題を考慮する必要があります。

一般に、共通のスタイルと固定構造のみがあります。モジュールは継承を利用して css を適用するのに適しています。

それ以外の場合、スタイルを安易に継承しないでください。構造や性能にほとんど差がない 2 つのモジュールの場合、継承は実装には適していません。

良い点同じスタイルで変更が難しい部分を抽出し、異なるモジュールに組み合わせて適用する方法です。

たとえば、2 つの divs

<div class="a"></div>
<div class="b"></div>

は共通のスタイルを抽出して 1 つのステートメントに置くことができます:

.fixedAd {position:fixed;width:200px;height:200px;border:1px solid #ccc;}

次に、異なる div に独自のスタイルを記述します:

.a {color:#ffc;background:#ccf;}
.b {color:#777;background:#999;}

最終的に結合された HTML 構造は次のとおりです:

<div class="a fixedAd"></div>
<div class="b fixedAd"></div>

つまり、結合は継承よりも優れています。これはプログラミングに似ています (笑)

以上がCSSはどのようにしてスタイルを継承できないのでしょうか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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