スタイルシート講座〜スタイルシートとは
ではスタイルシートについて説明していきます。
スタイルシートは大まかに言うと、HTMLがページを構成するのに対して、デザインやその補助的な役割を担当する部分にあたると思います。
スタイルシートの記述方法ですが、headタグの中に埋め込む
<style type="text/css">〜</style>
という宣言の後、記述する方法とbodyの中にそのまま埋め込む
< @ style="A" > 〜 </@>
という書き方があります。@の部分にはHTMLのタグが入り、Aにはスタイルシートの宣言部分が入ります。
本講座でははじめのhead部分にスタイルシートを宣言したやり方を使いますがこれにも何種類か宣言方法があります。
まず、タグにそのままスタイルを設定する方法です。
<style type="text/css">
H4 {color:blue}
</style>
これはH4タグにフォントカラーをブルーにする宣言です。
つぎは、クラス宣言です。
<style type="text/css">
.class1 {color:blue}
</style>
これはclass1にフォントカラーをブルーにする宣言を加えたものです。
どう違うかというと、前者のほうはH4タグにしか使えませんが、後者のほうはどのタグにもclass1を埋め込む形で使うことができます。なおクラス名はなんでも構いません。
本講座では後者方を使っていきます。
分かりにくい説明ですが、、、百聞は一見に如かずということで早速本題に入っていきましょう。