css - 順序を適用するCSSファイル

Question

CSSファイルについて質問があります。ブラウザに適用する順序です。我々は持っています：

1. ブラウザ（システム）CSSファイル、
2. ユーザーCSSファイル、
3. ユーザーCSS重要なファイル、
4. サイトCSSファイル、
5. サイトCSS重要ファイル、

ページが読み込まれると、CSSコードの一部が、順序または！重要な単語に応じて他のコードを置き換えます。上記の順序は正しいので、サイトのCSS重要ファイルは以前のすべてのスタイルを上書きできますか？

Answer 1

CSSコードは他のCSSコードを置き換えるものではなく、スタイルシートの解析順序は関係ありません。適用可能なすべてのスタイルシートが考慮されるため、実際には適用の順序はありません。複数のスタイルシートが要素のプロパティに値を割り当てる場合、競合はカスケードルールに従って解決されます。その場合の順序は次のとおりです。

1. ユーザーエージェント宣言（ブラウザーのデフォルトスタイル）

2. ユーザーの通常の宣言

3. 著者（ページ）の通常の宣言

4. 著者（ページ）の重要な宣言

5. ユーザーの重要な宣言

したがって、作成者（ページ）!important宣言は、ユーザー!important宣言以外のすべてよりも優先されます。Css 1では順序が異なりましたが、これはCSS 2で変更され、ブラウザーは現在のルールに従って動作します。ユーザーが自分の権利を行使したい場合は、常に最後の単語があります。

Answer 2

いいえ。ユーザーCSSファイルはサイトCSSファイルの後に解析されます（そうでない場合、ユーザーCSSファイルを使用しても意味がありません）。これは、Webサイトのcssファイル内のすべてを自動的にオーバーライドするという意味ではありませんが、通常のCSS特異性ルールが引き続き適用されます。

私のウェブサイトにルールがある例として、すべての段落を赤にしましょう。

website.css: p { color: red; }

しかし、ユーザースタイルシート（FireFoxのuserContent.cssなど）を実装して、次のように言うと、

FireFox userContent.css: p { color: blue; }

テキストの色は青になります。

次に、Webサイトのルールを重要とマークした場合：

website.css: p { color: red; !important }

色は再び赤になります。