スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

高画質のまま画像を小さく表示できるCSS

CSSで画像のサムネイルを綺麗に表示する方法が紹介されています。

Tip: High quality CSS thumbnails in IE7

img.thumb { -ms-interpolation-mode: bicubic; }

こうすることで、HTMLで画像を元サイズより小さく表示させた場合でも、綺麗なままで表示できるようです。


試しに、ひまわりの画像を表示してみます。

sunflower

sunflower

sunflower

元画像は以下より。
This Time the Dream's on Me

小さく表示してもほとんど見栄えが変わりません。これは便利。
今までは、サムネイル用画像と、元サイズの画像を両方用意していたので、このCSSを使えばその手間も省けそうですね。

ちなみに、これはIE7用に設定しているらしく、FirefoxやSafariではデフォルトでこうなっているとか。知りませんでした。IE6だとやはりギザギザになりますね。

新しい記事

ピックアップ

Related Posts Plugin for WordPress, Blogger...
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。