2004年11月15日 (Mon)

全称セレクタが凄いんですよ。

最近はPerlを駆使して仕上げていかねばならないタスクが非常に多く、純粋にHTMLCSSへ打ち込める時間は少なくなってしまった。しかし、今日は久々にお仕事でもCSSをいじる機会に恵まれ、関連情報のサイトをあれこれ参照していた所、ふと『全称セレクタ』なるものがあるのに気が付いた。

CSSに関する知識量としては決してプロに引けを取らないレベルであると自負している(てか事実それで給料貰ってる)私であるが、矢張り特殊な部分に関しては完璧に知識として身に付いている訳ではない。特にセレクタ関連は複雑で、ブラウザによって実装がまちまち(※特にIEは酷い)な為、迂闊に使用するとエラい目に遭う事も多い。
しかし、今回発見した『全称セレクタ』はそういった不安なく使えるモノである。例えば、従来のCSS解説書には次のような記述がしばしば見受けられた。

body要素に文字サイズや文字色を指定しても、Netscapeではテーブル内の要素にそれらが反映されません。従って

body{
color: #fff;
font-size: 12px;
}

と指定するのではなく、

body, th, td{
color: #fff;
font-size: 12px;
}

等と指定するようにしましょう。

しかし、全称セレクタを用いると更にスマートな記述が可能となる。例えばこんな感じだ。

*{
color: #fff;
font-size: 12px;
}

たったこれだけの記述で、あらゆる要素の文字色及び文字サイズが一括で指定出来る事になる。弊害として大きく表示したいヘッダ要素まで小さくなってしまう事等が挙げられるが、全称セレクタを平気で使えるような変態であれば、ヘッダの文字サイズも個別に設定することで納得いくまでデザインを煮詰めてあるに違いない。つまり、何だかんだ言っても全承セレクタはCSSを酷使する人間にとって結構使い勝手の良い代物なのである。

しっかし、ここまで本腰入れてスタイルの優先順位とか考えたのも久々だなー…。

Copyright © 2007 Team Flame Magician, All rights reserved.