移动端开发一直以来无可避免的问题就是不同设备的不同分辨率和不同DPR（设备像素比），这里简单介绍其中一种解决方案，rem适配。

什么是rem？

相对长度单位，相对于根节点（html）的字体大小计算值的倍数

在进行移动端开发时，如果使用px作为单位，我们很难同位固定长度的px单位来适应不同大小的屏幕。而采用rem单位，在不同的设备下通过调整根节点字体大小来整体改变页面元素的布局及大小，会使得工作变得简单许多。

那么我们需要解决的问题就是如何识别不同的屏幕并根据屏幕的大小修改根节点文字的大小了。

var designWidth = 640,
    rem2px = 100;
    
document.documentElement.style.fontSize = 
    ((window.innerWidth/designWidth)*rem2px)+'px';

通过上面的代码对根节点的字体大小进行修改后，在css中我们只需要将100px换算成1rem，就可以完成移动端的适配了。