CSS3字体大小单位的认识px/em/rem

1.px: 父元素设置px字体大小,只要子元素或者子孙元素没有设置字体大小或者设置的字体大小优先级没有父元素高的的话,子元素/子孙元素继承其父元素的px字体大小设置

*********************************************************************

调整浏览器大小,对px、em都没有影响,对rem会有影响

**********************************************************************

2.em:必须要知道父元素的字体大小,相对于父元素的字体大小确定元素的字体大小

假设:父元素 px:18px 

   子元素em: 1.4em

  则:子元素的字体大小为: 18px *1.4em = 25.2px

3.rem: 是相对于页面根元素<html>

假设: html字体大小为:62.5% ,//其实就是10px ,因为浏览器默认的字体大小为16px ,所以10px / 16px = 62.5%,

         元素rem: 1.4rem,

 则: 子元素的字体大小为: 10px * 1.4rem =  14px

(当调整浏览器大小时,这个值也会改变  ,假设 现在浏览器的值是12px ,则html的值是:  12px * 62.5 = 7.5px)

         元素rem: 1.4rem,

 则: 子元素的字体大小为: 7.5px * 1.4rem =  10.5px

 rem浏览器兼容性: 不兼容IE6-8

原文地址:https://www.cnblogs.com/ljh-zw/p/11168386.html