设备像素比 devicePixelRatio

设备像素比 window.devicePixelRatio = 设备物理像素 / 设备独立像素(dpi)

常见设备Dpr查询:http://screensiz.es/phone

设备物理像素: 设备设备分辨率,eg: iPhone 6  750*1334
设备独立像素: 与设备无关的逻辑像素(在没有缩放的情况下,1个css像素等同于一个设备独立像素)

Retina高清屏造成图像模糊的原因:
    同样尺寸的一张图片(css为单位),它的每一个css像素点 --> 在Retina高清屏下被用更多的设备物理像素展示,即放大,所以会模糊;

解决方式:

   根据设备 window.devicePixelRatio 不同的dpr,采用不同的图片

   设备像素比 devicePixelRatio_第1张图片

备注:
  设备屏幕尺寸:设备对角线的长度

参考文章:http://www.cnblogs.com/jingwhale/p/5741567.html

  

你可能感兴趣的:(Css)