响应式图片

1.picture

<picture>
    <source media="(max-36em)" srcset="img/ad001.png 480w" type="image/svg+xml"/>
    <source media="(max-50em)" srcset="img/ad001-m.png 800w" type="image/webp"/>
    <source srcset="img/ad001-l.png 1600w"/>
    <img src="img/ad001.png" alt="">
</picture>

2.srcset

  <img src="img/ad002.png" srcset="img/ad002.png 480w,img/ad002-m.png 800w,img/ad002-l.png 1600w" alt="" sizes="(max-800px) 800px,100vw">

　　

3. js

4.svg