セレクタの書き方をおぼえよう   no comments

Posted at 4:03 pm in

セレクタを書く時はセレクタの後にプロパティと値を入れます。
セレクタ{プロパティ:値}
例えると次のようになります。
h1{color:#CC0000;}
これは、h1(大見出し)の文字にcolor(色)を指定、その色は#CC0000(赤色)という文です。
最初に変えたいモノを書き{ }の中に変えたい部分とどう変えるかを書きます。(ものすごく簡単に言ってしまえば)
間に入れる : と最後に入れる ; を忘れずに。 : で前と後ろが関連している事になっています。
; で1つの命令が終了しています。
また、複数のスタイルを指定する事も出来ます。
例えば
h1{color:#CC0000;font-size:12px;text-align:center;}
これは、先程の文にfont-size(文字の大きさ)とtext-align(文字揃え)の指定を加えました。
これによって、h1(大見出し)は赤色で12pxの大きさで中央揃えになります。
文が長いと見づらいので改行を入れると見やすくなり、後々の修正に便利です。

h1{
color:#CC0000;
font-size:12px;
text-align:center;
}
とこんな感じにするとスッキリします。
基本的に{ }の中にデザイン面を指定していく作業の繰り返しですね。
面倒くさく感じるかもしれませんが、WEBサイトのページ数が増えても、全てのページのh1がCSSを使えば、「赤色で12pxの大きさで中央揃え」に一瞬でかえられるので後々かなりラクになります。

Written by admin on 10月 26th, 2010