html5のpicture要素を使ってみた｜フロントエンド｜新着情報｜たいしょん倶楽部 ｜名古屋でWebデザインを学ぶ学生のブログ

picture要素って何？ その名の通り、写真に関する要素であることは間違いないです。そんなの見りゃ分かるよ！というわけで概要を調べてみました。 <picture> 要素は、画像リソースの読み込みを宣言的に行う仕組みです。Web 開発者はこの要素によって、CSS や JavaScript によるハックなしに、レスポンシブデザインで画像を扱えるようになります。また、画像リソースの読み込みがネイティブに実装・最適化されたのは、遅いモバイル回線でページを見ているユーザーにも嬉しいことです。これはとくに重要でしょう。（ http://www.html5rocks.com/ja/tutorials/responsive/picture-element/ ） ということは、CSSでメディアクエリを使用することなく画面サイズに応じて画像をあんなことしたりこんなことしたりできるわけですね！しかし、HTM