viewport的target density

dips（device independent pixels，设备独立像素）与屏幕密度有关。dips可以用来辅助区分视网膜设备还是非视网膜设备。

window.devicePixelRatio是设备上物理像素和设备独立像素(device-independent pixels (dips))的比例:      window.devicePixelRatio = 物理像素 / dips

 

 

当页面设置了<meta name="viewport" content="width=device-width">时候，document.documentElement.clientWidth在大部分浏览器下，得到的是布局视区的宽度，等同于dips（设备独立像素）的宽度而不是物理像素的宽度。即此时浏览器的宽度为设备独立像素的宽度

 

对于screen.width的值：

• 在iOS视网膜设备上，screen.width返回dips宽设备独立像素。因此，在竖着显示的时候，视网膜显示屏的ipad和非视网膜显示屏的ipad返回的都是768.
• 在上面提到的三个Android设备上，screen.width返回的是物理像素宽度，分别480, 720, 和800. 该设备上的所有浏览器都是该值。