思考一个问题，假如我们的设计稿是750px,我们量出来一个盒子的宽度是75px,那么在640px下面，它应该是多少合适呢? 答案是:64
问题，如果才能保证你写的css的尺寸只需要写一次，在不同的屏幕尺寸下面不用改?
---> 假如我们在750px下面，我们让html的font-size为75,则这个盒子的宽度是1rem,在640px下面我们让html的font-size为64,则这个盒子的宽度也是1rem，问题就这样解决了
--> 同时，我们的页面还会有一些其他的问题，比如1px的问题，在dpr为2的情况下会变粗，为了解决这个问题，一般常见的方案是：设置viewport(scale 0.5)
这些问题我们基本上可以不用考虑，因为我们可以直接考虑使用手淘出品的rem库解决我们的问题
###参考案例 https://github.com/zhengwei1949/mmb_template/blob/master/rem%E5%B8%83%E5%B1%80/index.html
- 引入布局用的flexible.js(我已经写到了head标签里，大家直接拷贝过去用即可)，要注意的是不要再写meta:viewport标签了，因为flexible.js会自动帮你创建的
- 引入base.css
- 把设计师拿过来的设计稿拿过来，标注稿基准字体大小 = 标注稿宽度 / 10，如标注稿宽为750，标注稿基准字体大小为75；标注稿宽为640，标注稿基准字体大小为64；
- 除了字体大小以外，其他所有的均按rem来，比如你的设计稿是750px的，那么，假如你量出来的是75px,则是1rem
- 字体除外，要根据不同的dpr设置不同的大小，比如如果是750的设计稿，那么字体假如是24px,则在dpr为1的情况下是16px,dpr2的情况下是24px,dpr3的情况下是32px(这块涉及到字体专业知识，总结一句话就是没有人会考虑用奇数字体，https://www.zhihu.com/question/20440679，所以不能让工具帮我们自动算，得写死)
- https://www.w3cplus.com/mobile/lib-flexible-for-html5-layout.html
- http://div.io/topic/1092
- https://www.w3cplus.com/css/fix-1px-for-retina.html
- https://www.w3cplus.com/css/vw-for-layout.html
- https://github.com/dxcqcv/generator-webpack-humble