1つの要素に複数のクラスが使用され、1つの属性値が複数のクラスで異なる値を持つ場合、その要素の属性の最終的な値はどうなりますか?
もちろん、優先順位が高い方が優先順位が低いものをカバーします。
CSS リンク ファイルと HTML ファイルを考えてみましょう。
css:
.form-control{ width: 100% ; ...}.width-control{ width:60% ;}
html:
1. <div class="form-control width-control">...</div> 2. <div class="width-control form-control">...</div>
上記はhtmlにおけるクラスの書き順を変更しており、有効な値は全てwidth: 60%であることが分かります。 HTML のクラス内に並列されていることを示します。 クラスの記述順序は、カバレッジの順序には影響しません。
CSS で定義されている順序を次のように変更します。
.width-control{ width:60% ;}.form-control{ width: 100% ; ...}有効な値この時点では、 width:100% で、クラスの優先順位を示します。これは、CSS ファイル内でクラスが定義されている順序によって決まります。後から定義されるほど、優先順位が高くなります。
??
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
