標籤實現響應式圖片

• 一個picture標籤裡面可以包含多個source標籤，每個source標籤裡可以使用媒體查詢和設定srcset屬性，瀏覽器會遍歷picture標籤中的每個source標籤，根據當下的情況，找到最合適的srcset,然後來設定img標籤的src屬性。

<div class="slider-img">
    <picture>
        <source srcset="img/ad001-l.png" media="(min-width:50em)">
        <source srcset="img/ad001-m.png" media="(min-width:30em)">
        <img src="img/ad001.png" alt="廣告圖片">
    </picture>
</div>

• 注意：相容性較差，配合picturefill外掛來使用

• picturefill 官方

• picturefill github