关于rem,我查过很多次手册,每次查完都忘记.
他是一个相对长度单位.
他是相对根元素(html)的font-size值的倍数,来描述元素的大小.
首先rem有兼容性问题.
![](https://img.haomeiwen.com/i15340136/e45609f046a36aca.png)
rem可以设置字体的大小也可以设置盒子的宽高.
![](https://img.haomeiwen.com/i15340136/f1b8d733c23087ad.png)
这里盒子的宽是400px,高度是200px;字体大小是40px;
当我们要修改盒子大小的时候,只需要更改根元素的font-size就可以改变所有使用了rem设置大小的盒子.
rem多用于webapp.相比viewpoint.rem更加灵活.viewpoint是将整个页面缩放,当我们有的东西要缩放,有的不要缩放的时候,rem就好用很多.
那么rem是如何实现响应式的呢?
css代码
![](https://img.haomeiwen.com/i15340136/2893056411362a07.png)
![](https://img.haomeiwen.com/i15340136/d47dd7edf0bc4a0b.png)
html代码:
![](https://img.haomeiwen.com/i15340136/0e8566b4cb4d2069.png)
网友评论