カテゴリー:
CSS
閲覧数:466 配信日:2017-05-29 22:41
結論
imgタグへ指定したクラスへ下記CSSを指定
※下記例ではimgタグへ指定している
img {
max-width: 100%;
height: auto;
}考え方
1.画像横幅
・可能な限り原寸表示
・スマホ横幅サイズに合わせて自動縮小
max-width: 100%;
2.画像高さ
・上記1で設定した横幅に合わせて(同じ縦横比率で)、高さを表示
height: auto;
ありがちな間違い
img {
max-width: 100%;
max-height: 100%;
}img {
max-width: auto;
max-height: auto;
}