ホームページ >ウェブフロントエンド >CSSチュートリアル >ソースコードにアクセスせずに、既存の Web サイト CSS を新しいファイルでオーバーライドする方法
ソース アクセスのない新しいファイルで現在の Web サイトの CSS を上書きする
概要
ソースコードを変更せずに Web サイトの外観を維持するのは困難な場合があります。この質問では、ソース レベルでアクセスできない Web サイト上の既存の CSS ファイルをオーバーライドする新しい CSS ファイルを作成することでこれを実現する方法について説明します。
CSS の仕様の概念
To既存の CSS をオーバーライドする方法を理解するには、CSS の特異性の概念を理解することが不可欠です。ルールで使用されるセレクターに基づいて、どの CSS 宣言が要素に適用されるかを決定します。特異性は次のように計算されます:
新しい CSS ファイルで現在の CSS をオーバーライドする
既存の CSS ファイルをオーバーライドするには、次のアプローチを検討してください。
例
次の HTML について考えてみましょう。および CSS:
<code class="html"><article> <div id="id"> <div class="class"> <section> <div class="inline" style="background-color:red"> </div> </section> </div> </div> </article></code>
<code class="css">body {margin: 0;padding: 0} div,article {min-height: 200px;height: 100%;width: 100%} #id { background-color: green } .class { background-color: yellow } section { background-color: blue } .inline { background-color: purple !IMPORTANT /*going to be purple - final result */ }</code>
クラス セレクターを使用し、特異性の概念を活用することで、既存の CSS スタイルを効果的にオーバーライドし、新しい CSS で定義されたスタイルに従って Web ページの外観をカスタマイズできます。ファイル。
以上がソースコードにアクセスせずに、既存の Web サイト CSS を新しいファイルでオーバーライドする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。