1. Best viewed on laptop in Responsive Design Mode
   1. ⌃ ⌘ R on Mac/Safari
   2. ⌥ ⌘ R on Mac/Firefox
2. Breakpoints are at 850px and 550px
   1. At 850px and above, the image with a width of 640px is shown
   2. At 550px and above, the image with a width of 480px is shown
   3. Below 550px, the image with a width of 320px is shown

HTML

<img 

    srcset="../images/elva-fairy-marked-320w.jpg 320w, 
            ../images/elva-fairy-marked-480w.jpg 480w, 
            ../images/elva-fairy-marked-640w.jpg 640w",

    sizes=" (min-width: 850px) 640px, 
            (min-width: 550px) 480px, 
            320px",

    src="../images/elva-fairy-640w.jpg" 
    
    alt="Picture of Elva">