CSS セレクター: クラスと ID の違い selectors_html/css_WEB-ITnose

類似点: 任意の要素に適用可能

相違点:

1. ID セレクターはドキュメント内で 1 回のみ使用できます。クラス セレクターとは異なり、ID セレクターは HTML ドキュメント内で 1 回だけ使用できます。クラス セレクターは複数回使用できます。

次のコードは正しいです:

<p>

<span class="stress">中国</span> 。 。 。 。 <span class="stress">習近平</span> は現在の大統領です

</p>

次のコードは間違っています:

<p>

<span id = 「ストレス」>中国は素晴らしい国です。 。 。 。 。 <span id="stress">習近平は国の現在の大統領です

</p>

2. クラスセレクターの単語リストメソッドを使用して複数の単語を設定できます。 1 つの要素のアイテムを同時にスタイルします。 1 つの要素に複数のスタイルを同時に設定できますが、これは ID セレクターではなく、クラス セレクターを使用してのみ実現できます ( ID ワード リストは使用できません)。

次のコードは

正しい(完全なコードについては右側のコードエディタを参照してください)

.stress{    color:red;}.bigsize{    font-size:25px;}&lt;p&gt;到了&lt;span <strong>class=&quot;stress bigsize&quot;</strong>&gt;三年级&lt;/span&gt;下学期时，我们班上了一节公开课...&lt;/p&gt;

以下のコードは

不正解です(完全なコードについては右側のコードエディタを参照してください)

#stressid{    color:red;}#bigsizeid{    font-size:25px;}&lt;p&gt;到了&lt;span <strong>id=&quot;stressid bigsizeid&quot;</strong>&gt;三年级&lt;/span&gt;下学期时，我们班上了一节公开课...&lt;/p&gt;

<p> ;来学期 <span id="bigsizeid" class="stress">3 年生</span> (これは可能です)

注: 上記のコードは color:red に変更される可能性があります。および font-size:25px ; 単語の色を赤に設定し、そのフォントを 25px に設定したい場合は、その色を 25px に設定するだけで済む場合は、これを使用する方がはるかに便利です。赤、それも必要です。私はクラス セレクターの方が好みなので、クラス セレクターは詳細であればあるほど良い (と私は思います)。 ！ ！