css中px(像素Pixels)是什么意思?

来自:互联网
时间:2019-11-11
阅读:

CSS提供了丰富的文档样式外观,以及设置文本和背景属性的能力;允许为任何元素创建边框,以及元素边框与其他元素间的距离,以及元素边框与元素内容间的距离;允许随意改变文本的大小写方式、修饰方式以及其他页面效果。

CSS像素(css pixel):

CSS像素是Web编程的概念,指的是CSS样式代码中使用的逻辑像素。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。(引自CSS2.0手册)

在CSS规范中,长度单位可以分为两类,绝对(absolute)单位以及相对(relative)单位。px是一个相对单位,相对的是设备像素(device pixel)。

比如iPhone 5使用的是Retina视网膜屏幕,使用2px x 2px的 device pixel 代表 1px x 1px 的 css pixel,所以设备像素数为640 x 1136px,而CSS逻辑像素数为320 x 568px。

设备像素与CSS像素之间的换算是如何产生的呢?

这就需要要谈到每英寸像素(pixel per inch)和设备像素比(device pixel ratio)。

每英寸像素(pixel per inch):

ppi,表示每英寸所拥有的像素(pixel)数目,数值越高,代表显示屏能够以越高的密度显示图像。

设备像素比(device pixel ratio):

以上计算出ppi是为了得到密度分界,获得默认缩放比例,即设备像素比。

返回顶部
顶部