CSS 单位
1, 绝对单位
px: 逻辑像素, 绝对单位
2, 相对单位
em: 基准点为父节点字体的大小
rem: 相对根元素字体大小来计算
vw: 视口宽度, 将视口宽度的 1% viewport-width
vh: 视口高度, 将视口高度的 1%
vmin:vw 和 vh 中较小的那个
vmax:vw 和 vh 中较大的那个
最常用的 CSS 单位
px
px 是一个绝对单位
em
em 是一个相对单位, 改变 font-size 的大小时, 它的尺寸就会发生变化.
在没有任何 CSS 规则的前提下, 1em 的长度是: 16px
如果有任何 CSS 规则改变了字体大小 (不管在文档的什么位置),1em 的长度会变成相对于新的 font-size 的大小.
em 单位当设置了 font-size 属性后, 它会逐级向上相乘
rem
rem 和 em 一样也是一个相对单位, 但是和 em 不同的是 rem 总是相对于根元素, 而不像 em 一样使用级联的方式来计算尺寸. 这种相对单位使用起来更简单.
值得注意的浏览器支持问题: IE8,, Safari 4 或 iOS 3.2 中不支持 rem 单位.
来源: http://www.jianshu.com/p/4cf69ffbb9ef