【前言】
在移动端开发页面的时候,免不了要适应各种不同步的屏幕,因此要使用css中的em和rem单位。
两者的主要区别如下:
1. em是相对于使用了em单位的元素字体大小的一个相对单位(平常说的相对于父元素完全是因为继承的原因).
2. rem是相对于根元素html字体大小的一个相对单位.
使用方法:
移动端一般给的设计稿的宽度是750px, 而浏览器一般有最小字体大小限制,因此,我们一般设置html字体大小为
html {
font-size: calc((100vw / 750) * 100)
}
这样一来设计稿中的50px, 就是 50/100 = 0.5 rem 了。
em同理。