# px
绝对单位,页面按精确像素展示
【注】也有认为是相对单位,相对于显示器屏幕分辨率而言的.譬如,windows 的用户所使用的分辨率一般是 96 像素 / 英寸.而 mac 的用户所使用的分辨率一般是 72 像素 / 英寸.
# em
相对单位,基准点为父节点字体的大小,如果自身定义了 font-size 按自身来计算(浏览器默认字体是 16px),整个页面内 1em 不是一个固定的值
# rem
相对单位,可理解为 "root em", 相对根节点 html 的字体大小来计算,CSS3 新加属性,chrome/firefox/IE9 + 支持
# %
百分比,占最近父元素的百分比大小
# vw
viewpoint width,视窗宽度,1vw 等于视窗宽度的 1%
# vh
viewpoint height,视窗高度,1vh 等于视窗高度的 1%
# vmin
vw 和 vh 中较小的那个
# vmax
vw 和 vh 中较大的那个
# in
绝对单位,寸 / 英寸(不同设备各异,大致情况如下)
in 与 px 的对比
# cm
绝对单位,厘米 (不同设备各异,大致情况如下)
cm 与 px 的对比
# mm
绝对单位,毫米 (不同设备各异,大致情况如下)
mm 与 px 的对比
# pt
点 (Point),绝对长度单位.大约 1/72 寸 (10pt 大约为 13px)
pt 与 px 的对比
# pc
派卡 (Pica),绝对长度单位.1in = 2.54cm = 25.4 mm = 72pt = 6pc
pc 与 px 的对比
# ex
取当前作用效果的字体的 x 的高度,在无法确定 x 高度的情况下以 0.5em 计算.(IE11 及以下均不支持,firefox/chrome/safari/opera/ios safari/android browser4.4 + 等均需属性加么有前缀)
ex 与 px 的效果对比(仅供参考)
# ch
以节点所使用字体中的 "0" 字符为基准,找不到时为 0.5em(ie10+,chrome31+,safair7.1+,opera26+,ios safari 7.1+,android browser4.4 + 支持)
ch 与 px 的对比(仅供参考)
来源: http://www.jianshu.com/p/57ae78d9edef