へっぽこデザイン備忘録〜縦横比を維持したまま画像を枠内に収めるCSS〜

画像を枠の中に収めつつ、画像が枠サイズより小さかった場合は画像を引き伸ばさず表示させたい!

ということが最近あり、試してみたら案外できたので紹介します。
といっても収めたい画像のimgタグに下記を追加するだけという簡単な方法です・・・。



これを追加することで、最大でも枠サイズいっぱいになり、
最小でも画像のサイズをそのまま維持できます!

関連記事

コメントは利用できません。

ピックアップ記事

  1. 2016-10-17

    へっぽこデザイン備忘録〜好きな模様を選んでSVGの背景パターンを生成&CSSコードで使用できるHero Patterns〜

    今回は便利なHPを紹介します。 好きな模様と色を選んでSVGの背景パターンを生成し、CSSで設定で…

ピックアップ記事

  1. 2016-11-9

    気軽に芸能人気分が味わえる?? 芸能人が愛するロケ弁BEST3!!

    最近我が社で2週間に一回、芸能界あるあるのロケ弁を頼んで社員全員でランチしよ…

ピックアップ記事

  1. 2016-6-28

    【売れっ子への道渋滞中】若手芸人高齢化について考える。其の一

    若手といえば何才くらい?テレビで体を張って笑いを取る若手芸人たち。「若手」という言葉を聞けば、誰もが…
ページ上部へ戻る
Top