前端工程师手册

响应式字体

px, em ,rem这是web开发中常用的几种字体单位。

关于字号单位

对于webapp上文字用什么单位的问题,一直以来都是让我们csser头疼的问题,公说公有理,婆说婆有理。有人说px好,有人说em自适应,有的说百分比牛逼,rem文字出来就跟风说目前最好的就是rem单位。不管是什么说,我们还是要实地捣腾一下。

px

px是指相对于自身的字体大小的单位。

px像素单位是针对电脑屏幕来说的一个单位,对于桌面上来说,衡量屏幕尺寸的就是分辨率了,1920*1280的分辨率屏幕,横向就是1920像素,纵向1280个像素点(除高清屏幕外),那我们设置一个字体样式 font-size:12px 计算得出来的应该是相对于电脑屏幕分辨率的12个单位长度,所以有时候我们会陷入一个误区:px像素单位是一个绝对长度单位,但是其实它也是一个相对单位长度,它相对它的显示设备分辨率。

em

em(font size of the element)是指相对于父元素的字体大小的单位。

1em默认为16px。

rem

rem(font size of the root element)是指相对于根元素的字体大小的单位。简单的说它就是一个相对单位。

1rem默认为10px。

参考资料