スタイルシート（CSS）の基本的な書き方と必要な知識

セレクタ { プロパティ:値 ; … }

セレクタとは

スタイルシートで設定する内容には、このセレクタ、プロパティ、値が必要です。

セレクタにはスタイルシートを適用したい範囲を記述します。

例えば、HTMLの要素名であったり、IDやクラスを指定することもできます。

{　}内に記述したプロパティと値はこのセレクタで指定した範囲にのみ適用されます。

プロパティとは

プロパティはスタイルシートで設定する数々の規定された書式を記述します。

例えば、横の長さ（width）、文字の大きさ（font-size）、マージン（margin）などです。

プロパティ名は日本語ではなく、基本的に予め決められた英字です。

本スタイルシート辞典は、このプロパティと値を紹介しています。

値とは

一方、「値」とは各プロパティが持つそのプロパティの設定値です。

各プロパティには一つ一つにこの値とデフォルト値が定められています。

例えば、文字サイズを12ピクセルにしたいとき、プロパティは「文字サイズ（font-size）」、その値が「12ピクセル（12px）」になります。

プロパティによっては、値の指定の仕方が数種類ある場合もあります。

例えば、サイズを指定する場合でも絶対値で指定することもできれば、相対値で指定できることもできます。

書き方の注意

一つのセレクタに、プロパティと値は複数設定できます。

この場合、CSSの書き方にあるように、プロパティと値の間にカンマ「；」を挿入します。

もちろん、複数の異なるプロパティを1つのセレクタに記述した場合、そのセレクタに対し、記述した全てのプロパティが有効になります。

複数のプロパティは以下のように複数行にわたって書いても構いません。

1つのセレクタを個々に指定する

1つのセレクタに対して、スタイルシートの中で異なるプロパティを別々に指定することもできます。

この場合、全てのプロパティが有効になります。

また、同じプロパティを指定した場合は、後に書かれた値が有効になります。