好久没写教程了（可能会误导新手的菜鸟教程(￣▽￣)"）。
这是我的github，欢迎前端大大们和我一起学习交流
https://github.com/pwcong
最近入职公司做前端实习，这几个星期来学到了移动端H5页面适配。（以前根本没做过移动端网页/(ㄒoㄒ)/~~，还是微信端的）
所以把我学到的一个小知识点写下来，也分享给前端新手们。
正文 0x00 大概说明做移动端网页和pc端很大不同的便是现在移动端窗口分辨率繁多。
很多时候UI给的设计图只有一份，还是按照iphone6设计的，这就让前端适配其他例如6plus或安卓等其他移动端头疼。
还好，阿里巴巴2015年底公开了其成熟的适配方案，lib-flexible，至于其可靠性可参考每年天猫活动的移动端页面。
这个方案的用法大概是这样的，HTML 头部引入 lib-flexible 的样式和js库，容器或组件宽高主要使用单位 rem ，字体大小则不变仍然使用单位 px。
还有一个约束是，因为只面向移动端，因此我们限制最外层包裹的div最大宽度为 640px
我这里只简单介绍怎么使用 lib-flexible 实现移动端适配，如果需要深入解释的知识，请阅读如下文章：
https://github.com/amfe/article/issues/17
最新的库文件可以到这里下载：
https://github.com/amfe/lib-flexible
clone 下来后在 build 目录下找到 flexible.css 和 flexible.js 在HTML头部引入即可，例如：
<!DOCTYPE html> <html lang=http://www.likecs.com/"zh-CN"> <head> <title>lib-flexible demo</title> <meta charset=http://www.likecs.com/"UTF-8"> <meta name=http://www.likecs.com/"viewport" content=http://www.likecs.com/"width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"> ... <link href=http://www.likecs.com/"css/flexible.css" rel=http://www.likecs.com/"stylesheet"> <script src=http://www.likecs.com/"js/flexible.js"></script> </head> <body> ... </body> </html>