HTML のインライン スタイルを外部 CSS でオーバーライドするにはどうすればよいですか?

外部 CSS によるインライン スタイルのオーバーライド

インライン スタイルを含む HTML マークアップを操作する場合、これらをオーバーライドする必要がある状況が発生することがあります。外部 CSS を使用したスタイル。ただし、通常の CSS ルールを適用すると、必ずしも意図したとおりに機能するとは限りません。

インライン スタイルを効果的にオーバーライドするには、CSS ルールで ! important キーワードを使用できます。このキーワードはルールに高い優先順位を追加し、インライン スタイルが存在する場合でもルールが有効になるようにします。

たとえば、次の HTML マークアップを考慮してください。

<div>

CSS ルールを使用して div 要素のインライン スタイルをオーバーライドするには:

div {
    color: blue;
}

インライン スタイルは変更されません。オーバーライドされました。インライン スタイルが確実に上書きされるようにするには、! important キーワードを使用します:

div {
    color: blue !important;
}

ルールに ! important を追加すると、インライン スタイルよりも高い優先順位が与えられます。その結果、インライン スタイルで色が明示的に赤に設定されている場合でも、div 要素内のテキストは青でレンダリングされるようになります。

以上がHTML のインライン スタイルを外部 CSS でオーバーライドするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。