さくペラ

さくっとぺらいちというサイトのつづき

オブジェクト指向CSS(OOCSS)について

すぐにスパゲティコードになってしまうCSSはそもそもの仕様自体がおかしいのですが、オブジェクト指向CSSというものを考えている方がいらっしゃるみたいです。

参照:OOCSS(Object-Oriented CSS)の考え方 - in0in0の日記

OOCSSをみた感想ですが、クラスの複数指定をした場合、同じ要素の指定は上書きされてしまうので、結構気をつけて指定しないといけないという点が気になりました。

たとえば、unitクラスで指定したボックスのpaddingとsize1of3クラスで指定したボックスのpaddingが違う値のとき、あとから指定したクラスのpaddingで上書きされてしまいます。

ですので、クラスを設計する際に、絶対同じ属性を設定しないようにする必要があります。指定している属性内容が分かる名前をクラス名につけると分かりやすいかもしれません。

ただ、この手法ですと細かな設定クラスが煩雑にできてしまい、意図しない属性の上書きが生じる恐れがあると思います。

あと、クラスの複数指定はIE6では無効になります。一番最後に指定されたクラスのみ有効になるので、IE6を考えたときにこれらのロジックは崩壊してしまう点も、微妙といわざるを得ないですね。

参考:クラスセレクタ (E.warning)|セレクタ|CSS HappyLife ZERO