CSS1 では文脈セレクタは要素の木構造に対して先祖、子孫
全称セレクタであるワイルドカード * (アスタリスク)
div * p { font-size: 10.5pt }
* 前後の半角スペースに注意
子供セレクタ
子要素だけを指定したい場合、「大なり」不等号記号
IEはだめ。
隣接セレクタ
或る要素の共通の子要素であり、且つ相前後して隣接する要素にマッチ
h1 + h2 { margin-top: -5mm }
イメージ無しのblockquoteで引用を表示するCSSサンプル - WEBデザイン BLOG:より。
blockquoteでの引用を美しく表示するCSSサンプル:phpspot開発日誌のエントリーを読んでみて、イメージ無しでのblockquoteでの引用を二重引用符で表示するCSSサンプルを紹介してみることに。
「WEBデザイン BLOG」は恥ずかしながら最近知ったのですが、内容もデザインも素晴らしいサイト。思いっきり影響受けました。
blockquoteに関しては僕も長い事悩んでいまして、最近A List Apart: A List ApartのCSSを参考に( というかほとんどそのまま)利用する事に落ち着いたばかり。こちらはオーソドックスに画像での処理。
一方紹介してくれているひとつは画像ではなく文字を<span></span>でくくる方法ですが、やはりちょっと美しくはないですよね。普通に、
<blockquote><p>引用文</p></blockquote>
で行きたい所。
CSS疑似要素要素(:beforeと:after)を利用するのがやはりいいのかな。IEでは適用されませんけれど、htmlソースをデザインのためにいじるのは最後の手段かなあと思います。インクルードしているヘッダやフッタなどはOKだと思いますけれどね。
