今回も引き続きCSSを実際にHTMLファイル中に記述していきますが、応用として「ID属性を使う方法」と「CLASS属性を使う方法」の２種類を使います。

まずは以下のサンプルをご覧ください。


それでは順番に解説していきます。

まずはID属性とCLASS属性の違いについてです。
ID属性に一度記述したキーワードは、同じページ内で再度使用することはできませんが、CLASS属性に一度記述したキーワードは、同じページ内で再度使用することができます。
ページ内に同じID名は1つのみ、同じCLASS名は何回も使うことができます。
今回はサンプルということでabcやdefを使いましたが、ID名やCLASS名は基本的にどのようなキーワードであっても大丈夫です。

次に<style>タグの中身について説明していきます。
今回のセレクタはいつもと少し違う記述になっていますが、これは今までのセレクタにID名やCLASS名を追加で指定しているだけです。
また、ID名を指定するときは＃（半角シャープ）、CLASS名を指定するときは．（半角ドット）を記述するのを忘れないでください。
セレクタを記述せずに、いきなりID名やCLASS名を指定すると、タグの種類に関係なく同じID名やCLASS名が指定されているタグ全てにスタイルが適用されます。

ID属性やCLASS属性を使うと、各タグの<style>属性内に記述する必要がなくなり、管理も比較的に行いやすくなります。