CSS2の構文

ホーム > CSS > CSS2の構文

　基本的にCSSでは大文字・小文字を区別しません。
　ただし、クラス名・ID名・フォント名・URLなどCSSの制御外の部分については、大文字・小文字の区別があります。

　要素名、クラス名等に用いられる使用可能な文字は「A-Za-z0-9」の範囲にある文字、ISO10646で161以上のコードが振られている文字、「-」(ハイフン)となります。ただし、先頭の文字が「-」(ハイフン)や「0-9」(数字)であってはいけません。

　バックスラッシュ「\」には、CSSで規定されている特別な文字列({}"'等)を特別な意味を取り除くことが出来ます。例を示すと「"」を「\"」とすると本来持っている特別な文字列として扱われないようになります。

■コメント

　コメントは「/*」で始まり「*/」で閉じ、その間に記述します。コメントに記述された内容は「/*」と「*/」の間ならばどこにあってもよく、処理に影響は及びません。
　ただし、コメントを入れ子にしてはいけません。以下に例を示します。

コメント正常例(1)

/* ･･･ */

コメント正常例(2)

/* ･･･
*/

コメント異常例(1)(赤い部分は入れ子となります。)

/* ･･･ /* ･･･ */ ･･･ */

コメント異常例(2)(赤い部分は入れ子となります。)

/* ･･･
/* ･･･ */
･･･ */

■宣言とプロパティ

　複数の宣言を「,」(セミコロン)で区切ってグループ化することで、同じセレクタに対して宣言を並べることが出来ます。

以下の複数の宣言は･･･

H1 { font-weight: bold }
H1 { font-size: 12pt }
H1 { line-height: 14pt }
H1 { font-family: Helvetica }
H1 { font-variant: normal }
H1 { font-style: normal }

以下のようにグループ化することが出来ます。

H1 {
font-weight: bold;
font-size: 12pt;
line-height: 14pt;
font-family: Helvetica;
font-variant: normal;
font-style: normal
}

　ブラウザによりますが不正なプロパティ・値が指定された宣言は、無視されます。

例えば、以下のスタイルシートでは、不正なプロパティ・値が宣言されています。

H1 { color: red; font-style: 12pt } /* 不正な値: 12pt */
P { color: blue; font-vendor: any; /* 不正なプロパティ: font-vendor */
font-variant: small-caps }
EM EM { font-style: normal }

　ブラウザでは、「font-style: 12pt」と「font-vendor: any;」は未定義である為宣言を無視し、以下のように解釈します。

H1 { color: red; }
P { color: blue; font-variant: small-caps }
EM EM { font-style: normal }

[ホーム] [CSS] [↑ページ最上部へ戻る]

Webデザイナーになれる！
HTML、FLASH、CSS等様々なWeb技術やデザインに関することを学ぶことが出来ます。Webデザイナーなら、是非どうぞ！資料請求は無料！です。