CSSを使って背景の角を丸くする方法(Firefox限定)
ネットでCSSを使って角を丸くする方法が紹介してありました。 現在のところFirefox3ではきちんと表示されるのですが、IE7やOpera10では表示されませんでした。 通常の背景画像を角丸PNGを使ったりSPANタグを使ってする方法が間違いないと思いますが、このような方法もあるということだけ紹介します。 背景画像の部分のDIVタグにCSSで-moz-border-radius-bottomleft:30px;-moz-border-radius-bottomright:30px;-moz-border-radius-topleft:30px;-moz-border-radius-topright:30px; とCSSで指定するだけです。 この方法のメリットは次の通りです。 背景画像を丸角で用意する必要がない。(四角画像でよいのでリピート指定ができる) ボーダーを指定してもきちんと角丸に表示される。 軽い 丸の具合をpxで指定できるので、修正が簡単。 この方法で、IE7やOperaなどで表示されるようになれば、かなり実用性が高いのですが・・・。 何かしら方法はあるのでしょうが・・・。 ネタ元はこちらです。 http://css-tricks.com/blurry-background-effect/ 英語ですが、データのダウンロードができるので、わかりやすいと思います。 ...more»