こんにちは!ディレクターのせりなです。 レスポンシブサイトを制作するうえで、 パソコンにはパソコン用に、スマートフォンにはスマートフォン用に 違うデザインの画像を使いたいことってありますよね? いっぱいCSSを書いたり、不慣れなJavaScriptを使ったり 世の中には難しい方法が沢山ありますが・・・ なんかどれもよくわかんない。もーヤダ!っていうあなたに朗報! 私が知っているなかで1番シンプルかつ使いやすい方法をご紹介します! 今日からはもうレスポンシブ対応で悩まなくて大丈夫です! レスポンシブサイトの画像切り替えのデモ レスポンシブ用の画像切り替えデモは下の画像をご覧ください。 DEMO パソコンだと水色の画像が見えていて、 スマートフォンだとピンクの画像が見えていますか? パソコンから見ている方は、ブラウザのサイズを小さくしたり 大きくしたりすると、途中で画像が切り替わるかと思います
![【レスポンシブ】PCとスマホで違う画像に切り替える方法!CSSだけで簡単画像切り替え!](https://cdn-ak-scissors.b.st-hatena.com/image/square/8b1632dd77c8e1a9ff7a588e05503e203a0dec0f/height=288;version=1;width=512/https%3A%2F%2Ffastcoding.jp%2Fblog%2Fwp-content%2Fuploads%2F2017%2F04%2Fresponsive_img_keyimg.png)