CSSと一枚の画像だけで透明感のある角丸パーツをつくる方法

※ 下記の記事に誤りがありました。謝罪＆修正記事はこちらへ。

あいかわらず流行っている角丸系パーツですが、新しいテクニックが紹介されていたのでエントリー。

» Even More Rounded Corners With CSS – Schillmania.com

一つの透過処理されたPNG画像とCSSだけで下のようなパーツを作れてしまいます。

PNG画像を縮小したりしているみたいですね。もちょっと複雑なデモページはこちら。スクリプトのダウンロードもできます。

» Even More Rounded Corners (Fluid, Alpha-transparent, Single Image Approach) Using CSS

透過処理もされていてなかなかきれいですが、一長一短があるアプローチなので用途に合わせてお使いください。

ツイッターもやっています！

フォローはお気軽に！@taguchiまで！