2008年7月5日土曜日

スタイルが効かない・・何がいけない・?

先日、CSS初心者の友人がメッセで泣いていたので、
下記のサイトを紹介してあげたところ、無事解決した・・とのことでとても喜ばれました。

初心者が陥りそうなCSSの7つの間違い

スタイルが効かない理由はいくつかあって上記のブログに書いてある項目をチェックするだけでほとんど解決するので、慌てずにひとつひとつ確かめていくといいかもしれません。


□外部CSSファイルを読み込み忘れた。(CSSファイルの読み込みパスが違う)

□IDとclassの指定を間違えた。

□子孫セレクタの構造が間違ってた。

□途中のプロパティのセミコロンを付け忘れてた。

□別のところで優先度の高いセレクタで書いているのを忘れていた

↑これが一番やっかいですね。サイトが大きくなってきたり、しばらく時間おいてから
更新したりするときに、以前どんな手順で構築していったか忘れてしまって、ありがちです。

ここから引用-------------------------------------------

●通常セレクタ(bodyとか) 1点
●クラスセレクタ(.contentとか) 1点
●IDセレクタ(#containerとか) 100点
●直接指定(style="color:#fff"とか) 1000点

(例)
#container #headLine .contents { ... }

という指定があったとすると、IDセレクタの優先度は100なので、

#container(100) #headerLine(100) .contents(1)

となります。
優先度は単純に足し算なので、この場合は優先度は「201」となります。

なので、#articles .contents { ... }と書いたとしても、当然優先度の高いスタイルが適用されるのでいくら更新してもスタイルは変更されません。


-------------------------------------------ここまで

というわけで、上記のブログ便利なので。
他にとーーーってもありがちな「CSS勉強する上でぶつかる壁」なポイントを押さえてくれてるので
初心者さんは押さえておくと良いかと・・・・




参考になったよ!って方はwebの森のfacebookページへイイネをしてね(v^ー゜)



0 件のコメント:

webの森のFBページへも来て下さい