移动端页面尺寸适配

以iphone6设计图为基准

一、网易做法:

二、淘宝做法:

两者页面元素尺寸都以rem为单位，但是文字字体大小不要使用rem换算，
而是使用媒体查询来进行动态设置，比如下面的代码就是网易的代码：

@media screen and (max-width: 321px) {
    body {
        font-size:16px
    }
}
 
@media screen and (min-width: 321px) and (max-width:400px) {
    body {
        font-size:17px
    }
}
 
@media screen and (min-width: 400px) {
    body {
        font-size:19px
    }
}

或者

@media screen and (max-width: 321px) {
    header,footer {
        font-size:16px
    }
}
 
@media screen and (min-width: 321px) and (max-width:400px) {
    header,footer {
        font-size:17px
    }
}
 
@media screen and (min-width: 400px) {
    header,footer {
        font-size:19px
    }
}