class（クラス）の使い方
スタイルシートを使って文字の色は変更出来たでしょうか？
『CSSの書き方』ではタグの中にCSSを書きました（インラインでの記述）が一般的にはタグの中に書く事はあまりありません。
class（クラス）とid（アイ・ディー）
と言うものをつかって外部に書きます。聞き慣れない言葉が出てきました。さっそく見ていきましょう。
CSSの書き方 Class
まず外部にclass（クラス） を使ってCSSを書く方法です。ここで言う外部とは<head>の中に記入する事を言います。
<head>
<style type="text/css">
<!--
.font{
color:blue;
}
-->
</style>
<head>
<body>
<p class="font">CSSを使って青字にします。</p>
</body>
</html>
CSSを使って青字にします。
タグの中に書いてしますCSSとは大分ちがった感じになりました。
まず<head>部分から説明します。CSSを使うためのタグ<style type="text/css">〜</style>を記入しその中にCSSを記入していきます。
画面に記入したCSSが見えないように<!--〜-->
をつかってコメントアウト（見えないようにする）します。class（クラス）を使うので
. （ドット）を書きクラス名を書きます。今回は font
と言う名前をつかっていますが自分で考えた名前でも大丈夫です、ただし数字（1,2,3...）や記号（_,-）
からは始められません。
.font-red .width-120px ←○
.-font .120px ←×
名前を決めたら { 〜 } を記入しその中に
『プロパティ』と『値』を記入します。
『プロパティ』と『値』の記入方法はタグの中に書く方法と同じです。
では、作ったクラスをタグに指定します。クラス名は font なのでタグの中に class="font"と記入します。これで指定したタグの中のテキストは青く表示されます。
クラスでCSSを作っておくとこんな便利な事も出来ます。
<head>
<style type="text/css">
<!--
.font{
color:blue;
}
-->
</style>
</head>
<body>
<p class="font">CSSを使って青字にします。</p>
<p class="font">CSSを使って青字にします。2行目</p>
</body>
</html>
CSSを使って青字にします。
CSSを使って青字にします。2行目
同じページの中であれば作ったクラスを何回でも指定する事が出来ます。
<p>文字を緑にしてみましょう。2行目</p>
<p>〜</p>に囲まれた文字を緑色にしてみましょう。
<head>
<style type="text/css">
<!--
.font{
color:green;
}
-->
</style>
</head>
<body>
<p class="font">文字を緑にしてみましょう。</p>
<p class="font">文字を緑にしてみましょう。2行目</p>
</body>
</html>
何度も書いて書き方をマスターしましょう。