CSS长度单位

绝对长度单位

像素px(pixels)

计算机屏幕上的一个点(1px = 1/96th of 1in)，在web上，像素px是典型的度量单位，很多其他长度单位直接映射成像素

英寸in(inches)

1in = 2.54cm = 96px

厘米cm(centimeters)

1cm = 10mm = 96px/2.54 = 37.8px

毫米mm(millimeters)

1mm = 0.1cm = 3.78px

1/4毫米q(quarter-millimeters)

1q = 1/4mm = 0.945px

点pt(points)

1pt = 1/72in = =0.0139in = 1/72*2.54cm = 1/72*96px = 1.33px

派卡pc(picas)

1pc = 12pt = 1/6in = 1/6*96px = 16px

 

字体相关相对长度单位

em

表示元素的font-size属性的计算值，如果用于font-size属性本身，相对于父元素的font-size；若用于其他属性，相对于本身元素的font-size。即描述相对于应用在当前元素的字体尺寸，所以它也是相对长度单位。在CSS中，em是非常有用的单位，因为它可以自动适应用户所使用的字体。

1em 等于当前的字体尺寸。
2em 等于当前字体尺寸的两倍。
一般浏览器字体大小默认为16px，则2em == 32px；
例如，如果某元素以12pt显示，那么2em是24pt

ex

指所用字体中小写x的高度。但不同字体x的高度可能不同。实际上，很多浏览器取em值一半作为ex值,
ex在实际中常用于微调

rem

相对于根元素html的font-size属性的计算值

ch

与ex类似，被定义为数字0的宽度。当无法确定数字0宽度时，取em值的一半作为ch值,ch在实际中主要用于盲文排版

 

视口相关相对长度单位

vh

viewpoint height，视窗高度，1vh=视窗高度的1%

vw

viewpoint width，视窗宽度，1vw=视窗宽度的1%

vmin

vw和vh中较小的那个

vmax

vw和vh中较大的那个