CSS で !重要なルールを使用するにはどうすればよいですか? (コード例)-CSSチュートリアル-php.cn

CSS で !重要なルールを使用するにはどうすればよいですか? (コード例)

青灯夜游

リリース： 2019-02-20 10:47:23

オリジナル

4271 人が閲覧しました

Web サイトのコーディング方法を学ぶ最良の方法の 1 つは、他の Web サイトのソースコードを見て、いくつかの役立つテクニックを学ぶことです。ソースコードを表示すると、コード内に「!重要」という文字が表示される場合がありますが、これは何を意味するのでしょうか?用途は何ですか?次の記事では、!重要なルールについて説明します。お役に立てば幸いです。

CSS で !重要なルールを使用するにはどうすればよいですか? (コード例)

#!重要なルールは何ですか?使い方？

! important は、指定された CSS スタイルルールの適用優先度を高めるために使用される CSS ルールです。これは、CSS 値の末尾に追加されて、より重み付けされます。 [ビデオチュートリアルの推奨:

CSS チュートリアル]

CSS では、スタイルルールが要素にカスケード方式で適用されます。次のリストの重みが大きいほど、重みは小さくなります。

● ブラウザスタイル: Web ブラウザによって宣言されるデフォルトのスタイルです。

# ユーザー宣言スタイル: ユーザーがブラウザーオプションを使用して設定したカスタムスタイル、または開発者デバッグツールを通じて変更されたカスタムスタイル。

# 開発中に宣言されたスタイル: Web サイト開発者によって CSS スタイルシートで宣言されたスタイルです。

# !重要なルールを含む開発者が宣言したスタイル。

# !重要なルールを含むユーザースタイル。

#!重要なルールの使用例:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<style>
#container{
	width: 450px;
	height: 200px;
	font-size: 25px;
}

#example{
color:red !important;
}

#container #example{
color:pink;
}
</style>
</head>
<body>

<div id="container">
    <div id="example">PHP中文网！</div>
</div>

</body>
</html>

ログイン後にコピー

レンダリング:

CSS で !重要なルールを使用するにはどうすればよいですか? (コード例) 説明の例:

この例では、最初にインクルードがあります!重要なルールのスタイルは、要素 (#example) のテキストの色を赤として定義します。次に、この要素 (#example) のテキストの色をピンクに変更する別のスタイルがあります。なぜなら！重要なステートメントであるため、要素 (#example) のテキストの色はピンクではなく赤になりました。使わなかったら！重要な場合、色はピンクになります。

#!重要なルールをいつ使用するか?

絶対に必要な場合を除き、!重要なルールを使用しないでください。!重要なルールを使用すると、スタイルシートの自然なカスケード効果が損なわれ、コードの保守が困難になります。ただし、使用しなければならない状況もあります。 important:

1. Web サイト

をテストおよびデバッグする場合、! important ルールは非常に役立ちます。

コードに CSS の問題があり、特定のスタイルが適用されていることを確認したい場合は、! important ルールを使用して、より良い方法が見つかるまでサイトの問題を一時的に修正できます (これは可能性があります)。しばらく時間がかかる）。

2. 出力スタイルシート

#!重要なルールは、他のものによって上書きされることなくスタイルが適用されることを保証するために、出力スタイルシートにも使用できます。

結論

! important の使用はパフォーマンスに悪影響を及ぼしませんが、保守性の観点から、絶対に必要な場合を除き、可能な限り ! important の使用を避けてください。ルールとしては、特別な状況でのみ使用する必要があります。以上がこの記事の全内容です、皆様の学習のお役に立てれば幸いです。さらにエキサイティングなコンテンツについては、PHP 中国語 Web サイトの関連チュートリアルのコラムに注目してください。！！

以上がCSS で !重要なルールを使用するにはどうすればよいですか? (コード例)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。