Proportional adaptive phone screen
rem是根据html的font-size大小来变化，正是基于这个出发，我们可以在每一个设备下根据设备的宽度设置对应的html字号，从而实现了自适应布局。更多介绍请看这篇文章： rem是如何实现自适应布局的 。
目前有两种，一种是根据 js 来调整html的字号，另一种则是通过媒体查询来调整字号。
var width = docEl.getBoundingClientRect().width; var rem = width * 100 / designWidth; docEl.style.fontSize = rem + "px"; 第一行代码，获取移动设备的宽度，第二行，rem的值等于(设备的宽度)x100/(设计稿宽度)，第三行，设置html的字号为第二行的值。 有些人可能会注意到第二行代码跟淘宝的那个有所区别，区别就在于rem的换算比例，这里你可以任意改动为实际中的情况，比如有人喜欢用20px，那你可以将上面的100改为20，换算比例则改为1rem=20px。关于上面这段代码可以看之前的文章：Rem精简版实现自适应。 还有的人要用回淘宝的那个，那么第二行代码可以变为var rem = width/10; 换算比例则改为根据设计稿的宽度来调整了， 假设我们的设计稿宽是640的，则html的字体大小则被设为64px.则相当于1rem=64px。 具体实现请看之前的文章： rem自适应布局-flexible 。
说到底，上面的js代码不就是根据不同的设备调整对应的html字号嘛，那么我们根据实际的设备，来加上相应的字号不就行了吗？
我们知道html的默认字号是16px，则对应的设备下可以通过设置对应的font-size使其有一致的缩放比例。