画像の表示サイズ調整サンプル3

表示例は以下の通りです。ブラウザのウインドウサイズを様々に変化させて、表示を確認してみて下さい。
詳しい解説は、記事「画像を自動リサイズする際に拡大縮小しすぎを防ぐCSS」の本文をご参照下さい。

なお、サンプル表示に使っている画像の実寸サイズは、

です。

▼画像をウインドウ幅に合わせて表示したいが、極端に大きくなったり小さくなったりはしたくない場合

サンプル画像1

サンプル写真1

▲基本はウインドウ幅に合わせて自動縮小または自動拡大されますが、横幅850pxより大きくはならず、600pxより小さくはなりません。