メモ
・ウィンドウサイズで画像を切り替える
<picture>
<source media=”(min-width: 1024px)” srcset=”1024.jpg” />
<source media=”(min-width: 768px)” srcset=”768.jpg” />
<img srcset=”375.jpg” />
</picture>
・画面解像度で画像を切り替える
<img src=”375.jpg” srcset=”375.jpg 1x, 1024.jpg 2x” />
・ウィンドウサイズで画像を切り替える
<img src=”768.jpg” srcset=”1024.jpg 1024w,768.jpg 768w,375.jpg 375w” >
※Chromeで上手く動かない。。。
・ウィンドウサイズでの切り替えと、画面解像度での切り替えを組み合わせる
<picture>
<source media=”(min-width: 1024px)” srcset=”1024.jpg 1x,2048.jpg 2x” />
<source media=”(min-width: 768px)” srcset=”768.jpg 1x,1536.jpg 2x” />
<img srcset=”375.jpg” />
</picture>
