どうもshinyaです。
現在はインターネットの閲覧のほとんどが
スマホになってきましたね。
さて、サイト運営していくと、PCでサイトを
しっかり整えたとしてもスマホで自分のサイトを
見ると「えっ?」みたいなこともよくあります。
今回でいうと、画像のサイズです。
PC用にうまく画像の大きさを調節して表示
させていたとしても、スマホで見ると
そのままデカく表示されていたりすることが
あります。
このままにしておくと画像サイズに画面が
合わせてしまう為、ユーザビリティが下がります。
そこで今回この問題の超簡単な方法をお伝えしていきます。
スマホの大きさに画像を最適表示する方法
実は特に手順があるわけでもなく、
CSSに下記をコピーして貼り付けるだけです。
/* 画像サイズ最適表示 */
img {
max-width: 100%;
height:auto;
}
超簡単です。
CSSのどこにいれるかわからない人は、
一番下に貼り付ければOKです!
これで、しっかり、スマホで見ても画像の
大きさが自動で最適化され表示されます。
スマホで自分のサイトを見たときに画像が
大きすぎてどうすれば良いかわからない人は
是非こちらをお試しください。
【当サイト訪問者様へ今なら初心者用アフィリエイト教科書を無料プレゼント中!】
入手される場合は下記をバナーをクリック!※ダウンロード者数2万人突破!
【当サイト訪問者様へ今なら初心者用アフィリエイト教科書を無料プレゼント中!】