rem布局

rem

r–代表root根，也就是指html。
em–相对单位，也就是相对于html的字体大小单位。
没有设定html大小的情况下，1rem=16px，因此下方的div为160px*160px

rem的应用
比如说，现在有一个设计稿1000px。
因为每个人打开的时候，设备不同，或者浏览器设定的分辨率不同，使得需要在不同分辨率下打开。
假定屏幕大小为1000px，我们需要10rem来铺满整个屏幕，只需要设定1rem=100px；
若屏幕大小为500px，依然需要10rem来铺满屏幕，则设定1rem=50px。
所以，用js来动态计算单位rem换算成px后的大小，就可以实现rem布局。如下：
 

上面代码中的div，永远都会占屏幕一半的宽度。

转自https://blog.csdn.net/weixin_41706310/article/details/108866598