二、移动端的适配问题

尺寸适配

只需要将viewport width等于设计稿的宽度即可。

<meta name='viewport' content='width=750,user-scalable=no'>

less与rem适配

1. less文件

@font-size: 设计稿的宽度 / 10rem;

#box{
    width: 200/@font-size;
    height: 100/@font-size;
}

2. 使用js做根元素的调整

document.documentElement.style.fontSize = document.documentElement.clientWidth / 10 + 'px';

window.onresize = function () {
    document.documentElement.style.fontSize = document.documentElement.clientWidth / 10 + 'px';
}