使用flexible.js实现移动端设备适配

别急,下面慢慢讲。

首先,我们得了解以下几个概念:

css像素

物理像素

devicePixelRatio

layout viewport

visual viewport

ideal viewport

虽然上面列举了很多,但是不要被吓着,其实都很简单的,网上也有非常多的介绍,只要大致了解就可以了。

2.了解我们使用的库flexible.js

手机淘宝从2014年中开始,全面推行flexible设计。什么叫flexible呢?其实flexible就是responsive的低端形态和基础。

手机淘宝用JS来动态写meta标签,手机淘宝的flexible方案是综合运用rem和px两种单位+js设置scale和html字体。

我们可以在GitHub上找到这个项目,可以通过网上查阅资料了解更多。

3.了解一个sublime text插件,加快我们的开发速度

这个不是必须,也可以自己手动计算。大家可以在我之前写的一篇文章中,了解该插件如何安装使用,真的非常非常非常简单,重要的话说三遍~

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20181116A0MEQ000?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。

扫码关注云+社区

领取腾讯云代金券

年度创作总结 领取年终奖励