CSS ドキュメントを作成するとき、競合するスタイル定義が頻繁に発生します。この場合は、次のルールに従ってください。
HTML 要素に複数の CSS スタイルが定義されている場合、最後の CSS スタイルのみが表示されます。例:
p {color: red}p {color: blue}/* 效果为蓝色 */CSS スタイルが DOM 要素の親ノードで定義されている場合、そのすべての要素はそのスタイルを継承します。
同じ要素に対して異なる選択方法がある場合、計算は重みに基づいて行われます:
使用！ important タグはセレクターの優先順位を最上位に上げることができます。
<body><p id="target" class="target">Hello World</p></body><style> p#target {color: black !important} p#target {color: red} p.target {color: blue} p {color: tomato} /* Black color is applied */</style>CSS ファイルを HTML にインポートするには、通常、次の順序で行います:
次のコード スニペットでは、CSS をインポートする 4 つの方法がすべて使用されており、最終的な効果は最上位の p タグのスタイル定義です。ただし、!重要が他の定義に含まれている場合を除きます。
- ;外部インポートスタイル
- セクションに
CSS セクションの @import を通じてインポートされた外部スタイル- < ; を通じてインポートされた外部スタイルの一部
りー
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
