码迷,mamicode.com
首页 > 其他好文 > 详细

我像素的理解

时间:2017-02-11 00:51:45      阅读:201      评论:0      收藏:0      [点我收藏+]

标签:不同   win   view   window   日常   分辨率   程序   depend   坐标系统   

1.设备独立像素(device-independent pixels (dips))设备独立像素(也叫密度无关像素),可以认为是计算机坐标系统中得一个点,这个点代表一个可以由程序使用的虚拟像素(比如: css像素),然后由相关系统转换为物理像素。所以说,物理像素和设备独立像素之间存在着一定的对应关系

不管是移动端还是PC端通过screen.width/height 获取的这个值是设备独立像素(CSS 像素),而不是设备的屏幕分辨率,因为设备的屏幕分辨率对于WEB开发者来说是无法通过代码来获得的,是完全透明的。

2.物理像素是构成整个屏幕的基础组件,也是最小物理单位,1个独立像素可由多个物理像素构成,如2*2个,3*3个等。

3.设备像素比(devicePixelRatio)是组成一个独立像素的物理像素数(即线长如横向、纵向、对角线);或者说线长(横向、纵向、对角线)上的物理像素数与设备独立像素数的对应关系。在javascript中,可以通过window.devicePixelRatio获取到当前设备的dpr。

在css中,可以通过-webkit-device-pixel-ratio-webkit-min-device-pixel-ratio-webkit-max-device-pixel-ratio进行媒体查询,对不同dpr的设备,做一些样式适配(这里只针对webkit内核的浏览器和webview)。

4.分辨率:日常所说的“这张图片的尺寸(或分辨率)是100x100像素”,一般都是在描述数字图片,这样的描述只是说明了图片文件包含多少个像素。比如图1中的七张图,我们习惯于说,第1张图的分辨率是1x1像素,第5张图的分辨率是20x20像素,其实只是说明了图片的像素数而已。

我像素的理解

标签:不同   win   view   window   日常   分辨率   程序   depend   坐标系统   

原文地址:http://www.cnblogs.com/rage-the-dream/p/6388471.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!