device-pixel-ratio with JS
HTML
<meta name="viewport" content="initial-scale=1.5" />
<h1>Device-Pixel-Ratio: <span></span></h1>
CSS
h1 {text-align: center; font-size: 30px; color: #a20000;}
/* styling basics */
html {padding: 20px 0; background-color: #efefef;}
body {width: 80%; padding: 40px; margin: 0 auto; background: #fff; box-shadow: 1px 1px 5px rgba(0,0,0,0.5); font-family: Verdana, Arial, sans-serif; font-size: 14px;}
JavaScript
var dpr = 1;
if(window.devicePixelRatio !== undefined){
dpr = window.devicePixelRatio;
}
document.getElementsByTagName("span")[0].innerHTML = dpr;