什么是rem
rem是一种相对字体大小单位,这个单位代表根元素的 font-size 大小（例如 <html> 元素的font-size）。当用在根元素的font-size上面时 ，它代表了它的初始值,默认的初始值是html的默认的font-size大小,比如当未在根元素上面设置font-size大小的时候,此时的1rem==1em,当设置font-size=2rem的时候,就使得页面中1rem的大小相当于html的根字体默认大小的2倍,当然此时页面中字体的大小也是html的根字体默认大小的2倍。
rem和em的区别
因为行业背景,国内的设计师大多数比较喜欢用像素(px),而国外的网站大多喜欢用em火rem,在这里我们重点讲一下rem和em的区别:
em特点:
- em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。
- em的值并不是固定的
- em会继承父级元素的字体大小
rem特点:
- rem是CSS3新增的一个相对单位
- 使用rem为元素设定字体大小时，仍然是相对大小，但相对的只是HTML根元素
- 通过rem既可以做到只修改根元素就成比例地调整所有字体大小，又可以避免字体大小逐层复合的连锁反应
- 不兼容IE8
所以,rem和em虽然都是相对单位,但是其本质区别是:rem是根据HTML的根节点来计算的,而em是继承父元素的字体大小
