十、rem适配方案
1.1 rem适配方案
1、让一些不能等比例自适应的元素,达到当设备尺寸发生改变的时候,等比例适配当前设备。
2、使用媒体查询根据不同设备按比例设置html的字体大小,然后页面元素使用rem做尺寸单位,当html字体大小变化元素尺寸也会发生变化,从而达到等比例缩放的适配。
苏宁手机端用的就是rem+媒体查询
苏宁易购(Suning.com)-家电家装成套购,专注服务省心购!
1.2 rem实际开发适配方案
1、按照设计稿与设备宽度的比例,动态计算并设置html根标签的font-size大小;(媒体查询)
2、css中,设计稿元素的宽、高、相对位置等取值,按照同等比例换算为rem为单位的值。
1.3 rem适配方案技术使用(市场主流)
技术方案1:
less
媒体查询
rem
技术方案2(推荐)
flexible.js
rem
技术方案1与技术方案2 原理是一样的,只是方式不同。
总结:
1、两种方案现在都存在。
2、方案2更简单,现阶段大家无需了解里面的js代码。
1.4 rem实