rem 自适应适配方法

rem是指相对于根元素（html）的字体大小的单位，它是一个相对单位，它是css3新增加的一个单位属性，我们现在有很多人用的都是px,但px是一个绝对单位，遇到分辨率不同的设备，做出的页面可能会乱，这就给我们造成了很大的影响，而且后期的修复也很费时间，所以rem是一个很不错的适配方法。rem的初始值是16px，也就是说在没有设置根节点的font-size的时候，1rem=16px；

下面直接进入例子：

在这里设置html的font-size:20px;就代表1rem=20px;

接下来就可以根据上面推算设置button的样式，1rem=20px;

width:6rem==>width:120px;height:4rem==>height:80px; 

 可以给大家推荐一个px、em、rem换算的软件：

 

可能会有很多人在想em和rem有什么区别呢？

em也是一个相对单位，但它是相对父元素的字体大小来转换单位的，它的值并不是固定的，它会继承父级元素的字体大小，

例如：