【図解】CSSだけで画像の縦横比を維持したサムネイルを表示する - Qiitaサムネイルを表示するときに、サーバサイドプログラムで画像の縦横を計算してサムネイル画像を作ることがあります。しかし、場合によってはCSS3でサムネイル画像を描画したほうが実装コストが低い場合があります。ここでは、CSS3を使ってサムネイル画像をキレイに描画する方法を紹介します。 1. 内接・外接とは？ 画像の変形方法はいろいろありますが、ここでは内接リサイズ・外接リサイズについてのみ紹介します。内接リサイズ・外接リサイズとは、画像の縦横比を維持したまま、枠のサイズにフィットするように画像のサイズを変更する描画方法です。印刷出版系の用語だそうです。 内接リサイズ 外接リサイズ
CSSでブラウザのウィンドウサイズに合わせて画像を拡大・縮小する方法
