绝对长度单位
像素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中较大的那个