网页css3 rem 单位

rem:W3C官网描述是“font size of the root element”,即rem是相对于根元素来设置大小。

rem是一种移动端的单位,用来让不同大小的设备获得同样的体验,原理是先设置一个基础值,
1rem等于html标签的字体大小,如果改变html的字体大小 就能修改1rem对应的px

html {
    font-size: 62.5%;
    /*10 ÷ 16 × 100% = 62.5%*/
    /*html默认16px,如果把默认字体大小改为10px那么1rem=10px,后面用起来就很方便*/
}
body {
    font-size: 1.4rem;
    /*1.4 × 10px = 14px */
    /*由于修改了html默认字体大小值所以把body的字体大小修改为1.4rem也就是14px,避免后面都变1rem(10px)*/
}
h1 {
    font-size: 2.4rem;
    /*2.4 × 10px = 24px*/
}

你可能感兴趣的:(网页css3 rem 单位)