Responsive & Retina Content Images using simple CSS & a spacer PNG - An over-engineered, real world example

Resize your browser window to see the img tags "change src". There are breakpoints set for "mobile first", 320px, 480px, 600px, 768px & 1024px.

Retina screens will be served an image that's twice the size.

A majestic line of Emperor penguins