移动端常见布局-rem适配方案

rem实际开发适配方案
①按照设计搞与设备宽度的比例，动态计算并设置html跟标签的font-size大小；（媒体查询）
②CSS中，设计稿元素的宽、高、相对位置等取值，按照同等比例换算为rem为单位的值。
rem适配方案技术使用（市场主流）
方案一
● less
● 媒体查询
● rem
方案二（推荐，更简单）
● flexible.js
● rem
rem实际开发适配方案一
设计稿常见尺寸宽度

设备	常见宽度
iPhone 4.5	640px
iPhone678	750px
Android	常见320px、360px、375px、384px、400px、414px、500px、720px大部分4.7~5寸的安卓设备为720px

一般情况下，以一套或俩套效果图适应大部分的屏幕，放弃极端屏或对其优雅降级，牺牲一些效果，现在基本以750为准
动态设置html标签font-size大小及页面元素取值
①假设设计稿是750px
②假设把整个屏幕划分为15等分（划分标准不一定可以是20份也可以是10等份）
③每一份作为html字体大小，即750/15=50px，在320px设备的下，字体大小为320/15=21.33px
页面元素取值
页面元素的rem值=页面元素在750像素下的px值 / html里面的文字大小