MENU

flexible.js 移动端自适应方案

February 6, 2020 • 默认分类阅读设置

flexible.js是阿里团队开源的一个库。使用flexible.js轻松搞定各种不同的移动端设备兼容自适应问题。

github地址:https://github.com/amfe/lib-flexible
官方文档地址:https://github.com/amfe/article/issues/17

引入方法:

1.引入阿里官方CDN

<script src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.4/??flexible_css.js,flexible.js"></script>

2.下载相关文件,获取需要的JavaScript和CSS文件。
首先点击这里下载相关文件
然后在网页 head添加

<script src="build/flexible_css.debug.js"></script>
<script src="build/flexible.debug.js"></script>

仅上传引入文件即可

建议对于js做内联处理,在所有资源加载之前执行这个js。
原理就是获取设备型号分辨率,然后对网页源代码进行修改。达到自适应的效果