HTML中关于字体单位的一些描述

HTML页面中,常用的有px、pt、%、em、rem

我们之前用em、百分比的时候遇到的问题就是计算,而且当嵌套的层级太多时就会非常难以把控,而用px则被固定死了,

现在我们用rem完全不用担心这个问题,因为rem的参照对象只有根节点。我们只需设置根节点的大小,所有子节点都只需参照它来设计就可以,

下面是px、em、百分比和pt的对比.

这里引用一张网络上面的对照图片,方便参照

技术分享

根据上面的图表(红色部分为默认,当然不同的浏览器渲染默认值不一样,具体还需各位实测)可以看出,

我们只需设置html根元素字体大小为75%,对应的px值就是12,这样我们可以很方便的设置页面的宽高和字体大小,

当然单位是rem,这样参考对象才会永远是html而不是父元素,当需要变化的时候,只需改变html的大小其他的元素都会相应变化。

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。