high-resolution-retina-displays.css

/* Use media queries for high-res CSS styles */
.demo {
    background-image: url(test.png);
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5) {
    background-image: url(test-@2x.png);
}
    
/* image-set W3C: http://dev.w3.org/csswg/css-images/#image-set-notation */ 
.demo {
    background: url(test.png); /* do not support `image-set` */
    background: -webkit-image-set(
                    url(test.png) 1x, /* normal displays */
                    url(test-@2x.png) 2x /* high-res retina displays */
                );
}