关于移动端适配问题

移动端适配采用rem进行编写CSS，整理了三种方案：

　　方案一：

　　　　简单的JS适配

function resizeRoot(width){
    var deviceWidth=document.documentElement.clientWidth,
            num=width,
            num1=num/100;
    if(deviceWidth>num){
        deviceWidth=num;
    }
    document.documentElement.style.fontSize=deviceWidth/num1+"px";
}
resizeRoot(750);
window.onresize=function(){
    resizeRoot(750)
}
　　拿到750尺寸的设计图，用PX/100即可

方法二：
　　使用Flexible.js实现H5页面的终端适配  这是阿里开发的一款适配插件
　　
　　拿到750尺寸的设计图，用PX/75即可

方法三：
　　使用CSS文件进行适配
　　

@media screen and (min-300px){html,body,input{font-size:15px}}
@media screen and (min-320px){html,body,input{font-size:16px}}
@media screen and (min-340px){html,body,input{font-size:17px}}
@media screen and (min-360px){html,body,input{font-size:18px}}
@media screen and (min-375px){html,body,input{font-size:18.75px}}
@media screen and (min-380px){html,body,input{font-size:19px}}
@media screen and (min-400px){html,body,input{font-size:20px}}
@media screen and (min-414px){html,body,input{font-size:20.7px}}
@media screen and (min-420px){html,body,input{font-size:21px}}
@media screen and (min-440px){html,body,input{font-size:22px}}
@media screen and (min-460px){html,body,input{font-size:23px}}
@media screen and (min-480px){html,body,input{font-size:24px}}
@media screen and (min-500px){html,body,input{font-size:25px}}
@media screen and (min-520px){html,body,input{font-size:26px}}
@media screen and (min-540px){html,body,input{font-size:27px}}
@media screen and (min-560px){html,body,input{font-size:28px}}
@media screen and (min-580px){html,body,input{font-size:29px}}
@media screen and (min-600px){html,body,input{font-size:30px}}
@media screen and (min-620px){html,body,input{font-size:31px}}
@media screen and (min-640px){html,body,input{font-size:32px}}
@media screen and (min-660px){html,body,input{font-size:33px}}
@media screen and (min-680px){html,body,input{font-size:34px}}
@media screen and (min-700px){html,body,input{font-size:35px}}
@media screen and (min-720px){html,body,input{font-size:36px}}
@media screen and (min-740px){html,body,input{font-size:37px}}
@media screen and (min-760px){html,body,input{font-size:38px}}
@media screen and (min-780px){html,body,input{font-size:39px}}
@media screen and (min-800px){html,body,input{font-size:40px}}
@media screen and (min-1024px){html,body,input{font-size:51.2px}}
@media screen and (min-1349px){html,body,input{font-size:67.45px}}

拿到750尺寸的设计图，找到对应的尺寸（除以2后的）用PX/18.75即可