单位介绍
px: 像素(Pixel),相对长度单位。像素px是相对于显示器屏幕分辨率而言的,手机上的100px和电脑上的100px其实绝对长度是不一样的,肉眼就能看出来,严谨的你可以用尺子量一下,这就是因为他们的分辨率不同。还有相当多的人认为px是绝对单位,这里告诉大家不要人与亦云,多思考
em: 相对于当前对象内文本的字体尺寸,会继承父级的字体尺寸。即 1em = 1 * 父级元素的font-size。明显,在多层嵌套的结构下使用em的话,由于层层继承的缘故,要确定最终呈现出来的尺寸会非常麻烦,过于混乱
rem: 相对于html根元素文本的字体尺寸,与中间层字体尺寸无关。即 1rem = 1 * html元素的font-size。rem就相当于是一个全局缩放因子,改变它一个就可以缩放所有以它为单位的元素,只要将它与屏幕分辨率关联起来,就可以完成屏幕自适应展现, html的font-size设置到12px以下还是会按照12px=1rem来计算