高性能検索順位チェックツール(無料)
IDとクラス
ある要素の中で、指定したIDまたはクラスを持つものに対してスタイルを適用させます。
IDセレクタ
IDはそれぞれの要素につける固有の名前(識別子)となり、一つの文書内で複数の要素が同じIDを持つことはできません。
記述例は以下の様になります。
[スタイルシート]
#myid {
font-size: 120%;
color: red;
}
[HTML]
<span id="myid">ここは上記のスタイルが適用されます</span>
クラスセレクタ
クラス(class)は、一つの文書内で複数の要素につけることができる「グループ名」のようなものです。
ある特定のスタイルを、複数の要素に適用したい場合に使用します。
記述例は以下の様になります。
[スタイルシート]
p.myclass {
font-size: 120%;
color: red;
}
[HTML]
<p class="myclass">ここは上記のスタイルが適用されます</p>
<p class="myclass">ここにも上記のスタイルが適用されます</p>
<p>ここにはスタイルが適用されません</p>
特定の要素に依存しないよう、要素を省いた形で記述することもできます。
[スタイルシート]
.myclass {
font-size: 120%;
color: red;
}
[HTML]
<p class="myclass">ここは上記のスタイルが適用されます</p>
<span class="myclass">ここにも上記のスタイルが適用されます</span>
<p>ここにはスタイルが適用されません</p>

