このページはHTMLタグ辞書のサンプルページです。
レスポンシブイメージと“picture”要素の使い方について解説するためのサンプルページです。
ビューポートの横幅に応じて画像を出し分ける
<p>
<picture>
<source media="(max-width: 320px)" srcset="sample-320-sp.png">
<source media="(max-width: 640px)" srcset="sample-640.png">
<source media="(min-width: 640px)" srcset="sample-1280.png">
<img src="sample-640.png" alt="サンプル画像">
</picture>
</p>
