CSSの背景画像指定についてメモ。

今までページ最上部のタイトル・サブタイトルボックス内に模様の壁紙を敷き詰めていたのだけれど。
（CSS内で♯banner内にて背景画像をリピート設定。）
そのぶん、きっちりと「ボックス」な感じがするのをなんとなく変えてみたくなったので、ポイント的に画像を入れてみることにしました。

最初、クローバーの画像を100×100pixで正方形に切り抜いたやつをアップロードし、同じくCSS内の♯banner内で「リピートなし／水平位置：250pix」という位置指定でCSSを書き換えてみたわけです。
それにしてもDreamweaverのCSS編集ウインドウは便利だね。
あんまりソースのことわからなくてもとりあえず、項目にチェック入れたり数字を入れるだけでうまいことやってくれるというか。
こういうのをメモ帳だけでやるヒトってすごい。

そうすると、ちゃんと左側から250pixの位置にクローバーがひとつ、背景に出るようになります。
これを各ブラウザで検証してみたのですが、いまひとつな結果に。

・Win　IE6　→　ＯＫ
・Win　Netscape7　→　背景真っ白
・Mac　Safari　→　ＯＫ
・Mac　IE　→　背景真っ白

MacのIEでおかしいのはさすがにマズいと思ったので、画像の左側に250pix幅の白い空間を足した画像を作り直し、水平位置指定はやめて、単に「リピートなし」で背景を指定すると。
上記4つのブラウザで正常にクローバーが見えるようになりました。

CSSってなんでもできるのねと感動したものの、まだまだだねえ。

毎日このページを（自サイトのトップページ以上の回数で）みているので、デザインは自分自身が一番先に飽きちゃいます。
ことにRSSリーダーなどでいろんなウェブログを次々にみていると、内容を読むことと同じくらいにデザインを鑑賞するのが楽しいし、刺激になるのです。
ココログを利用でもびっくりするくらいオシャレにデザイン変えしているところがどんどん出てきてるのでめらめらと燃える思いで(笑)観察したりとか、やっぱりMTっていっぺんやってみたいわあとほのかに（いやかなり）憧れたりとか。
もちろん、日記は記述する中身あってこそのものですが、デザイン込みで試行錯誤しつつ育てていきたいと、私のトコロの場合は思ってますよ。

えーとちなみに、このよつばのクローバーは、ウチでデスクトップアイコンとして配布してましてなかなか好評です。
右サイドバーからサイトにあそびにきてね。