Lecture/InfoDesignB2004/7th/CSS のバックアップ(No.2)

CSS

HTMLで、スタイルシート（情報のかたちの表現）をする方法として、 CSS (Cascading Style Sheet) があります。

CSSは、W3Cが策定しており、 1996年にCSS Level 1 (CSS1) が、1998年にCSS Level 2 (CSS2) の 2つが勧告されています。実際に利用されているのはCSS1で、 CSS2は徐々に利用が広まっています。

この授業では、CSS1を中心に、実用性のあるものを取り上げていきます。

CSSでは、スタイルを指定する対象（構成要素など）を選び、スタイルの種類や値を設定します。次のように、記述します。

pre> セレクタ {プロパティ:値}

/pre>

たとえば、次はh1要素に「文字を赤くする」というスタイルを指定するものです。

pre> h1 {color: #ff0000}

/pre>

「セレクタ」とは、スタイルを指定する要素を指定する部分です。「{...}」のカッコ内で指定したスタイルが適用されます。「プロパティ」とは、適用するスタイルの種類です。色やフォントなどの種類を指定します。「:」（コロン）で区切って、設定する「値」を指定します。

複数のプロパティを設定する場合は、「;」（セミコロン）で区切って指定できます。複数の行で書いてもかまいません。その場合は、それぞれのプロパティの行末に「;」を入力するのを忘れないでください。

たとえば、次は「strong要素に、文字を赤くして、フォントサイズを大きくする」という指定ですが、どちらも同じように表示されます。

pre> strong {font: #ff0000; font-size: large}

/pre>

pre> strong { font: #ff0000; font-size: large; }

/pre>

複数の要素に、同じスタイルを設定する場合は、セレクタで「,」を使って複数の要素を指定します。

たとえば、次は「h1要素とh2要素に、文字を青くする」という指定です。

pre> h1, h2 {color: #0000ff}

/pre>

次へ進んでください。