Retina Support for background images

This is based on a guide to adding retina support to websites.

To add a tiled (repeating) background cretae 2 images one at 100x100px and the other with the ‘_@2’ added to the file name at 200x200px then use the following css.

body {background: url(../images/bg.png) repeat; background-size: 100px 100px;}

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
   body {background: url(../images/bg_@2x.png) repeat;}
}