学习web移动开发的第一步,是要掌握好移动端显示的一些基本概念。
首先,贴一下一个资深整理人的博客,感觉整理得很到位。
基本概念
屏幕尺寸:通常我们所指的屏幕尺寸,实际上指的是屏幕对角线的长度(一般用英寸来度量)。
屏幕分辨率:一般用像素来度量 ,表示屏幕水平和垂直方向的像素数,例如1920*1080指的是屏幕垂直方向和水平方向分别有1920和1080个像素点而构成。
PPI(Pixels Per Inch):像素密度,来表示屏幕每英寸的像素数量,可利用勾股定理计算PPI。
设备独立像素:
像素单位的缺陷:不同设备的像素密度PPI是不同的,如 iPhone3G/S 为163PPI,iPhone4/S 为326PPI,这导致同样尺寸的图像在不同PPI设备上的显示大小不一样。比如说一张163*163px 的图片,它在 iPhone3G/S 中是1*1寸,但是在 iPhone4/S 中却是0.5*0.5寸。
设备独立像素:
设备独立像素是一个新的单位,它与像素单位有一个对应的比例关系。在IOS设备上叫PT(Point),Android设备上叫DIP(Device independent Pixel)或DP。
如 iPhone 3G(PPI为163)中1dp = 1px,iPhone 4(PPI为326)1dp = 2px。那么一张163*163dp的图片,在iphone3中是163*163px,在iphone4中是326*326px,最终用户看见的图片大小是差不多大的。
获取当前设备独立像素:w