日々の破片
| 著作一覧 |
2010-11-08
_ cssは直観的ではない
CSSにはまりまくる。
何にはまるのかというと、カスケード（で合ってるかな？）されるというのがおれには直観的ではないからだ。
<div class="a"> <table> <tr><td class="b">...
みたいになっているときに、
.a td { border-top: 1px double black; text-align: left }
とかしていて、
.b { text-align: right; border-bottom: 2 double black }
とすると、td要素に直接指定しているクラスbのプロパティのほうが上のほうで決めたaのtdのプロパティより強い（上書きできそう）と思えるのに、実際にはそうではないからだ。追加（上の例だとborder-bottom）はできるんだけど、text-alignは上書きできない。
で、はるか上の方で<div class="a">とかがあって、.a tdで決められているのに気付かず、ピンポイントでプロパティを設定してそれが有効にならないというのに、はまるからなのであった。（というか、多分、もう理解したとは思うが）
なんというか、悪いプログラミング言語みたいだ。幸い、そんなプログラミング言語は無いとは思うが。
var x = 32;
block {
var x = 48;
if (x == 48) // 外側のブロックでxは32に設定したので偽。
で、手元の辞典をあらためて読むと、
また、同じスタイルシート内でも競合が起こることがあります。その場合でも「!important」を使ってスタイルを優先させることができますが、一般的には、より細かい部分で指定しているスタイルが優先されます。たとえば要素に対して指定したスタイルよりはクラスに対して指定したスタイル、……が優先されます。もし、それでも競合してしまう場合には、より後に指定されたスタイルが優先されます。
とか書いていて、こういう場合はどうなんだ？ と疑問に思うのではあるが(というか、!importantがきかないし)、IDを使えば良いのか。が、tdだと複数あるしなぁ。でも変だな。最初にtdでborderを指定してやるとそれが優先されているようだけど、「class 要素」は「要素」より優先順位が低いのかなぁ。
詳解HTML&XHTML&CSS辞典 第4版(大藤 幹)
手元のは第3版だからそのあたりが違うのだろうか？
ジェズイットを見習え |
a td .bと書けばよいのです。<br>暗黙にCSS側に適用される側のツリー構造の反映を期待してしまっているのがおかしいかな。<br>優先順位の決定は、ある要素に適用される一連CSS側のセレクタのみで決定されています。<br>このへんは http://css-happylife.com/archives/2007/0113_2250.php とかにありますが、まぁ、疑問に思ったらartonさんの場合仕様書読んだ方が速いのでは。
ツッコミありがとうございます。<br>>.a td .bと書けばよいのです。<br>なんと。<br>>仕様書読んだ方が速い<br>ぐさ。今回はお客様モードで開発してたから、まったくその通りです。
あと、これが重要みたいですね。<br>>CSS側に適用される側のツリー構造の反映を期待<br>DOMみたいにCSSも構造化されているつもりになっているのが間違いなのか。このあたりの考え方の相違をcss側にふったのがjQueryの良い点なのかな、もしかして。
> このあたりの考え方の相違をcss側にふったのがjQueryの良い点なのかな、もしかして。<br>はい。ツリー上の要素群を指定するのって結構大変な話で、XPathとか結構あれなわけです。<br>しかし、実際問題jQueryとかのユースケースだと対象の「要素群」はCSSで指定しやすいようにclassがe 振ってあるわけで、と。
なるほど! ありがとう! おれはjQueryを理解してなかった。<br>イカサマ師だったらこれだけで「jQuery:KVM=prototype:RDB - クラウド時代のスタンダード シフト」とかをでっち上げられるな。
s/KVM/KVS/;s/prototype/prototype.js/ですかね。<br>さておき、jQueryの理解という文脈だと、method chainingというか、<br>あるべきものがあるべき形になっているのも大きい気がしますね。<br>http://coliss.com/articles/build-websites/operation/javascript/566.html<br>比較すると、なんでprototype.jsはこうなってるんだとか思ってしまう。<br>（まぁ、これを実現するためにjQueryはRails的な汚さが裏にあるんでしょうが）<br>ていうか、Rails的文化の延長でjQueryがでてきたと思っているんですが検証してない
KVMはひどい間違いだけど物理的にはそう外れてもいないところが面白い。<br>ボインタありがとうございます。