随着iphoneX的出现，新的一轮适配大法应该又出现了吧？不论是使用flex布局或者媒体查询，好似都不能完全解决新加的刘海带来的适配问题。
但是有一个单位vw就神奇的解决了这个问题。vw和vh是相对于视口（viewport）的宽度和高度 ，1vw等于视口宽度（viewport width）的百分之一，也就是说100vw就是视口的宽度；
1vh等于视口高度（viewport height）的百分之一。做移动端适配的时候，试想想，也就是将手机的视口进行高密度的细分，随着屏幕的改变，1vw所代表的视口大小也改变，不是可以解决随着屏幕
改变字体随着改变的问题了嘛？
如何使用vw这个单位呢？我们可以通过px单位进行转换呀！
之前做过一个项目要求完全适配所有移动端，这个时候，flex布局大法是解决不了所有手机的问题的。唯有vw出马，才能够一个顶两。
我写页面直接使用的就是px单位，给大家看看它在浏览器中转换的的值吧~虽然单位使用的是px，在浏览器中转换的却是vw。
在px转换成vw的过程中，什么是最大的功臣呢？当然就是我们的postcss啦！
postcss是强大的css预处理工具，有兴趣的童鞋，建议你们看看《深入postcssweb设计》，这本书里面对postcss进行了详细的讲解。
我写css总是喜欢写飞快，基本上是不动脑筋那就是最好的了，所以呀，不论怎么样，我第一件事情，就是要集成SCSS的呀。
接下来祭出我使用的postcss与gulp结合使用vw适配移动端的方法吧。
我的
这个里面还是有一些小坑的。
你们要记得注意踩呀。
下面是我借鉴过的博客，没有这些博客的指引，我想，我可能不能使用postcss+gulp进行vw单位的移动端适配。
借鉴博客1https://www.jianshu.com/p/06d40d38cc06
借鉴博客2https://github.com/postcss/gulp-postcss
借鉴博客3https://segmentfault.com/a/1190000003909268
借鉴博客4http://ju.outofmemory.cn/entry/341641
借鉴博客5https://www.w3cplus.com/css/vw-for-layout.html
借鉴博客6http://hao.jobbole.com/postcss/
借鉴博客7https://segmentfault.com/a/1190000014185590
借鉴博客8https://www.w3cplus.com/css/aspect-ratio-boxes.html
借鉴博客9https://segmentfault.com/q/1010000011608582
借鉴博客10https://www.cnblogs.com/zy20160429/p/8205025.html
借鉴博客11https://blog.csdn.net/xuyunfei_2012/article/details/52847988
借鉴博客12https://blog.csdn.net/m0_37978717/article/details/73606499
借鉴博客13https://www.npmjs.com/package/gulp-sourcemaps
借鉴博客14https://www.cnblogs.com/Darren_code/p/gulp.html
借鉴博客15http://www.css88.com/archives/7317
借鉴博客16https://segmentfault.com/q/1010000012184986
借鉴博客17https://www.npmjs.com/package/gulp-cssnano
（另外，这篇博客我总结的太晚了，还有它存在很多问题的，比如没有集成js对吧。我想将webpack也集成进去的，没有做这个事情,
真的非常抱歉，博客并没有写的非常详细，主要是我最近有些恹恹的。希望快快打起精神，好好加油吧）