クラス、idを使用して個別にスタイルを適用することができます。 セレクタ{プロパティ:値;}のように記述すれば 記述した全てのセレクタ（要素）にスタイルが適用されてしまいますが クラス、idを使用すると目的の要素のみスタイルを適用させることがで きます。

■ クラスで個別にCSSを指定する

p.iro{color:red;}
.iro{color:red;}

<p class="iro">文字</p>
<div class="iro">文字</div>

要素（タグ）の後にピリオド、クラス名を記述します。 外部ファイルのiroの部分がクラス名になります。HTMLソース内でpタグにclass="iro"と指定した 部分のみが赤色になります。.iroのようにタグ名を省いた 形で書くとspanやdivなど、他の要素でも共通に使えます。
クラス名に使えるのは半角英数字やハイフン（-）です。
class="aaa"やclass="aa-a1"等。class="1abc"やclass="-abc"のように 先頭の文字が数字やハイフンで始まらないような名前でなければいけません。

■ idで個別にCSSを指定する

p#iro{color:blue;}
#iro{color:blue;}

<p id="iro">文字</p>
<div id="iro">文字</div>

要素の後に#、id名を記述します。 外部ファイルのiroの部分がid名になります。 pタグにid="iro"と指定した 部分のみが青色になります。 #iroのようにタグ名を省いた 形で書くとspanやdivなど、他の要素でも共通に使えます。
id名は名前の付け方はクラス名の名前の付け方と同じです。

クラスとidの違いは、クラスは同じクラス名で複数の箇所に同じスタイルを適用でき ますがidは同一ページ内でそのidは一度しか使えないという決まりがあります。

■ その他の項目

・ スタイルシートの記述方法
・ スタイルシートの記述場所
・ 複数のセレクタで指定
・ @importでCSSファイルを読み込む
・ 外部ファイルのコメント

スタイルシート一覧のページに行く