2007年10月アーカイブ

ユニバーサルセレクタ

*

ユニバーサルセレクタは、すべての要素を対象にするセレクタです。CSS2 で定義されました。
単独で使用してブラウザのデフォルトスタイルのクリアに用いたり、

foo という id 属性の付いた ul 要素の直接の子要素は除外した上で
孫要素以下の li 要素にスタイルを適用するなどといったことができます。

************************************************

セレクタってのは、スタイルを適用する対象で、bodyとかh1、p、ulなどです。
id名やclass名なども。
プロパティは、そのセレクタにどのようなスタイルを指定するかです。
marginやpadding、borderなど。
値は、指定したプロパティにどんな値を適用するかで、color:red;の太字のredの部分です。
コレで文字の色を赤にするという値を指定してます。

※一番多い記述の仕方だと思うので
この辺で癖を付けていくのがいいと思います。

////////////////////////////////////////////////////////////////////

●セミコロンについて
セミコロンはプロパティを複数続けて書く場合に使うんですが、1つの場合でも付ける癖を身に付けておいた方が、付け忘れなどを防げます。

●大文字と小文字の区別について
CSSではid名やclass名は大文字と小文字が区別されるので、下手に大文字を使ったりせず、まずは小文字で統一しましょう。
小文字で統一の別の理由として、XHTMLでは要素名は全て小文字で書くように決められてます。
その為、慣れない内に大文字などを使うと混乱の元になります。

●class名やid名で使用できる文字
開始は必ずアルファベットから（a～z、A～Z）です。数字から開始しないようにしましょう。
その後は、 アンダーバー（_）、ハイフン（-） 英数字が使えます。

●コメントアウトについて
（X）HTMLでは

のように記述する事で出来ますがCSSでは、

/* ココはコメント */

と書きます。ちなみにコメントの入れ子は出来ません。
こういうの↓
/* コメント/*アウト */ですよ */

CSSに慣れてないとうっかりって事も有り得るんで、間違えないようにしましょう。

また、今回のサンプル程度のボリュームならさして困りませんが、ちょっと面倒でも後々必ず役にたってくれるので、規模が大きくなったときにも見やすいようにスタイルの対象ごとにコメントで区切ったり、分かり難い部分にコメントをつけたりしましょう。