rem 布局适配方案
主要方法为：
按照设计稿与设备宽度的比例，动态计算并设置 html 根标签的 font-size 大小；
css 中，设计稿元素的宽、高、相对位置等取值，按照同等比例换算为 rem 为单位的值；
设计稿中的字体使用 px 为单位，通过媒体查询稍作调整。
上代码
JS代码：
<script>
window.addEventListener('orientationchange', setRem);
window.addEventListener('resize', setRem);
setRem();
function setRem() {
var html = document.querySelector('html');
var width = html.getBoundingClientRect().width;
html.style.fontSize = width / 16 + 'px';
};
</script>
CSS代码：
<style>
// sass写法
@function rem($px) {
@return $px / 46.875 + rem;
}
//less写法
@rem: 46.875rem;
//stylus自行解决
？
</style>
用法：
如：元素宽300px,高500px；
传入参数即可：width:rem(300); height:rem(500);
rem算法解释：
例如：
1，设计图是750；
2，屏幕宽度/16；
计算步骤：
第一步： 750/16 = 46.875，1rem = 46.875
第二步：比如logo图片宽度为240px，那么width应该写成5.12rem
