スタイルシートの使い方

スタイルシートを使うと、どのような効果が得られるかをまず実感しよう。 以下の2つのリンクは、HTML文書は全く同じbody要素(本文)となっているが、 スタイルシートによって見映えが異なるものになっている。

スタイルシートの書き方

スタイルの指定には以下の二つがある

  1. 要素によるスタイル定義
  2. クラスによるスタイル定義

前者は、

「全てのh1要素(大見出し)をもっと大きな文字にしたい」

あるいは、

「全てのp要素(段落)をもっと字下げして表示したい」

という風に、全域で自動的に有効になるものを指定したいときに利用し、 後者は

「一部のp要素だけ赤字にしたい」

というように、局所的にスタイルを変えたいときに利用する。

それぞれ例を見て行こう。

  1. 要素によるスタイル定義
  2. スタイル定義の記法
  3. クラスによるスタイル指定
  4. よく使うプロパティ集

→ 目次

(C)2004 OKOMA Lab. koeki-u.ac.jp