冬言響 / 日記

(無題)

無駄に代替スタイルシートとか書いてみる。こうやってある日突然おもむろにスタイル関連とかまっさらにした後ゼロから書き直したり切り替え機能付け直してみたり代替スタイルちまちま書き始めたりするのは毎度の事なんでまあ気にせんといてくださいな。

とりあえずセクションブロックのサイドにスペース大きめに取って h2 見出しをそっちに、ってのをやってみたかった。なんとなく。で、それをやるとサイドバー領域って言うか Profile やらをだらだら書き殴ってる部分をどこに置くかが問題で、一応横 800px ぐらいを基準に作ってるんで本文領域があんま狭くなるのも困るし、まあ別に代替スタイルだし display: none; でも構わんかなあとか考えてたらおもむろに「む! とんちづいた!!」というのが来て、画面の外に押し出すというのを思いついてみた。キタコレ! 良くねこれ? そうでもない? そうですか。タブっぽい画像をメイン領域の隅に置いてみるとか、ちょっと何か発展系をいずれ考えてみよう。

あとドロップキャップ。段落の最初の文字を倍角にして残りを回り込ませる、よくある視覚効果。これもなんとなくやってみたかったのでやってみた。最初のパラグラフの最初の文字だけ、ならば div.section p:first-child:first-letter で良いのだろうけど、hr で区切りを付けて違う話題に移った場合その最初のパラグラフにも同じ事やりたいので div.section h2 + p:first-letter, div.section hr + p:first-letter、あと順不同リストとかブロック引用とか画像だけのパラグラフとかで書き始めるってのも良くあってその場合もその後から始まる本文の最初のパラグラフに効果付けたいので、なんだかんだでセレクタだけで

div.section h2 + p:first-letter,
div.section p.image + p:first-letter,
div.section h2 + ul + p:first-letter,
div.section h2 + blockquote + p:first-letter,
div.section hr + p:first-letter,
div.section hr + ul + p:first-letter,
div.section hr + blockquote + p:first-letter

という事になってしまった。ううむ。まあ意図通りになってるぽいから良いか。Safari@Leopard、Firefox@Vista、IE7@Vista で確認。細かい部分の詰めはおいおいと。とかとか。

宮尾岳『アオバ自転車店[2]』買い。なんだかアワーズでも平行連載してるそうで。いよいよ単行本の発刊ペースが予測しづらくなってきたなあ。

アオバ自転車店[2]