【図解】CSSだけで画像の縦横比を維持したサムネイルを表示する - Qiitaサムネイルを表示するときに、サーバサイドプログラムで画像の縦横を計算してサムネイル画像を作ることがあります。しかし、場合によってはCSS3でサムネイル画像を描画したほうが実装コストが低い場合があります。ここでは、CSS3を使ってサムネイル画像をキレイに描画する方法を紹介します。 1. 内接・外接とは？ 画像の変形方法はいろいろありますが、ここでは内接リサイズ・外接リサイズについてのみ紹介します。内接リサイズ・外接リサイズとは、画像の縦横比を維持したまま、枠のサイズにフィットするように画像のサイズを変更する描画方法です。印刷出版系の用語だそうです。 内接リサイズ 外接リサイズ
別窓を開かずにその場クリックで拡大画像を表示する4つの方法 [ホームページ作成] All About![別窓を開かずにその場クリックで拡大画像を表示する4つの方法 [ホームページ作成] All About](https://cdn-ak-scissors.b.st-hatena.com/image/square/6ec4b03d1cb7a6f647ea70376bdd657185b7fdae/height=288;version=1;width=512/https%3A%2F%2Fimgcp.aacdn.jp%2Fimg-a%2F1200%2F900%2Faa%2Fgm%2Farticle%2F2%2F3%2F9%2F7%2F5%2F201708241603%2Ftopimg_original.png)
