HTML页面中,常用的有px、pt、%、em、rem
我们之前用em、百分比的时候遇到的问题就是计算,而且当嵌套的层级太多时就会非常难以把控,而用px则被固定死了,
现在我们用rem完全不用担心这个问题,因为rem的参照对象只有根节点。我们只需设置根节点的大小,所有子节点都只需参照它来设计就可以,
下面是px、em、百分比和pt的对比.
这里引用一张网络上面的对照图片,方便参照
根据上面的图表(红色部分为默认,当然不同的浏览器渲染默认值不一样,具体还需各位实测)可以看出,
我们只需设置html根元素字体大小为75%,对应的px值就是12,这样我们可以很方便的设置页面的宽高和字体大小,
当然单位是rem,这样参考对象才会永远是html而不是父元素,当需要变化的时候,只需改变html的大小其他的元素都会相应变化。