Load images based on screen size

Question

I have the following HTML code which displays an image:

     

        
                      

              相关标签:
       
      

Answer 1

Why not use srcset and sizes attributes of the <img>

<img srcset="tiger-320w.jpg 320w,
             tiger-480w.jpg 480w,
             tiger-800w.jpg 800w"
     sizes="(max-width: 320px) 280px,
            (max-width: 480px) 440px,
            800px"
     src="tiger-800w.jpg" alt="Bengal tiger">

For more reference go though Responsive_images

It supported by all major browsers