一、基本概念
1、设备像素(device pixel,dp)
设备像素(又称物理像素、屏幕分辨率),设备能控制显示的最小单位,我们可以把这些像素看作成显示器上一个个的点。设备像素随着设备生产出来就固定不变了,单位是 pt。
2、CSS 像素(css pixel,px)
CSS像素是Web编程的概念,独立于设备的用于逻辑上衡量像素的单位,也就是说我们在做网页时用到的CSS像素单位,是抽象的,而不是实际存在的。
3、独立像素:
:(也叫密度无关像素),可以认为是计算机坐标系统中的一个点,这个点代表一个可以由程序使用并控制的虚拟像素(比如:CSS 像素,只是在android机中CSS 像素就不叫”CSS 像素”了而是叫”设备独立像素”),然后由相关系统转换为物理像素。
4、每英寸像素:像素密度(Pixels Per Inch,PPI)
像素密度,准确的说是每平方英寸(1 英寸等于 2.54 厘米)的面积上排列的像素点数量。像素密度越高,代表屏幕显示效果越精细。
5、设备像素比:
是设备上物理像素和设备独立像素(device-independent pixels (dips))的比例。
公式表示就是:window.devicePixelRatio = 物理像素 / dips
二、开发协同
一般由设计师按照设备像素(device pixel)为单位制作设计稿。 前端工程师,参照相关的设备像素比(device pixel ratio),进行换算以及编码。
像素问题
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- 目录 1、移动端开发的基本观点2、像素基础知识3、viewport原理解析4、弹性布局5、响应式设计6、1rem的...
- 我们先从一个听的最多的概念——PPI开始。PPI什么是PPIPPI的复杂之处在于如果他所处的上下文环境不同,意义也...