こんにちは。mackyです。 今日はタイトル通り、PCとSPで違う画像を表示させる方法を紹介します。 ちなみに、初心者向けです。では早速。 <p class="logo"><img src="img/img_sp.png" width="100" height="100" alt="c-brains"></p> とりあえず、これだけでいいです。 みてわかるとおもうのですが、imgタグで埋め込んでいるのは、SP用の画像です。 css CSSも割とシンプルです。 img { vertical-align: top; } @media only screen and (max-width: 640px) { img { width: 100%; height: auto; } } .logo { width: 300px; height: 300px; margin: 0 auto; backg
![【RWD ーレスポンシブー】PCとSPで違う画像を表示させる | バシャログ。](https://cdn-ak-scissors.b.st-hatena.com/image/square/842f2cce0d1e35996f2a705768369a26c2d344ff/height=288;version=1;width=512/https%3A%2F%2Fbashalog.c-brains.jp%2Fimages%2Fcat_smartphone.png)