最近在看设计方面的文章，对于一些单位老是分不清（╯‵□′）╯︵┴─┴ ，现在整理一下。

最基本的两个单位

pt是point，点，是印刷行业常用单位，等于1/72英寸。pt是物理大小。 px是pixel，像素，是屏幕上显示数据的最基本的点。

像素密度

  • ppi=Pixel Per Inch，图像像素密度 （在图像中，每英寸所包含的像素数目）
  • dpi=dots per inch，打印像素密度 （每英寸所能打印的点数，即打印精度）

ppi(dpi) = √（长度像素数² + 宽度像素数²） / 屏幕对角线英寸数

谷歌给出的六种广义的像素密度分类:

  • ldpi (low) ~120dpi
  • mdpi (medium) ~160dpi
  • hdpi (high) ~240dpi
  • xhdpi (extra-high) ~320dpi
  • xxhdpi (extra-extra-high) ~480dpi
  • xxxhdpi (extra-extra-extra-high) ~640dpi

像素

device independent pixels (dip)=Density-independent Pixels(Device independent pixels)，密度(设备)独立像素，它是一个抽象单位,建立在屏幕的物理密度上，以160PPI屏幕为标准。

1
dp*ppi/160 = px

sp=Scale-independent pixels，尺度独立像素，它是安卓的字体单位，以160PPI屏幕为标准。

1
sp*ppi/160 = px

在Android设计原则中，有提到这两个单位，他建议文字的尺寸一律用sp单位，非文字的尺寸一律使用dp单位。例如textSize="16sp"、layout_width="60dp"。

CSS Font-relative lengths

em:"element",大小不固定 ,成为相对单位（body则相对浏览器的默认字体设置，子集相对父级，则em会继承父级元素的字体大小）,可看做1em＝100％ em * 浏览器字体大小(px) = px rem:"root element",CSS3新的单位，和em的区别是，rem是相对于根元素字体大小。 ex: 0.5em,小写字母x的高度 ch: 数字“0”的宽度 ex: 0.5em,小写字母x的高度 ch: 数字“0”的宽度

参考:

[无线手册-4] dp、sp、px傻傻分不清楚[完整] CSS Values and Units Module Level 3 Supporting Multiple Screens