記事一覧

CSS3で背景を重ねたりグラデーションしたり

CSS3が楽しい

WebkitのCSS3先行実装で複数の背景画像を指定したり、グラデーションとかも使えるらしいです。

練習を兼ねて、以前作った伺かゴースト更新フィードにシェル画像を表示してみました。

ファイル 72-1.png

SafariとGoogle Chromeでこんな感じに見えます。

ゴーストによって大きさがまちまちなので全体としてはイマイチですね。

Firefoxでも実装されているのですが画像のrepeat指定が上手く動かなかったので保留。Operaはよくわかんない。

やっぱやめた (10/03/14)

マウスホバーしたときに画面左右に立ち絵を表示する方がいいですね。これならサーフィスが見切れることも無いですし、Webkitに限らずIE6以外ならCSSだけで表示出来ます。

ファイル 72-2.png

…と思ったら今度はWebkitだけ表示出来ず。Webkitのバグっぽいですね(´・ω・`)