由于微信和QQ都已经更新了Blink内核，已经全面支持flex布局了，除了个别国产浏览器，基本上可以放心使用flex了，写了一个简单的flex的布局框架，只要设置相应的属性即可。

下面是基本的使用介绍

注意，设为Flex布局以后，子元素的float、clear和vertical-align属性将失效。

首先如果需要某个元素使用flex来排版的话，需要在自身设置flex，如下所示

<div flex >
    //code	
</div>
01.
02.
03.

box：设置子元素如何去分配空间。写在子元素。（默认可设置10个box）
如果只有一个子元素设置了box:1甚至任意值，都会把盒子剩余的空间给他。
如果子元素都设置了box:1，则去平均分配盒子的空间。
如果子元素其中某个设置了box:2，则该元素是其他元素的两倍。

<div flex >
    <div box="1"></div>
    <div box="2">该元素是上面元素的两倍宽</div>
</div>
01.
02.
03.
04.

（更多…）

移动端模拟滚动（支持PC端高级浏览器），支持横向和竖向滚动。

DOM结构如下：

<div class="wrap">
    <div class="content">
        //内容-必须为第一个子元素
    </div>
</div>
//如果需要横向滚动，标签写上x属性即可
<div class="wrap" x >
    <div class="content">
        //code
    </div>
</div>
01.
02.
03.
04.
05.
06.
07.
08.
09.
10.
11.

JS调用接口：

//传入元素的id或者class
var s = new iScroll('.scrollWrap');
s.top(function(a){
    //达到顶部执行,this为当前dom，a代表移动的距离
});
s.bottom(function(a,b){
    //达到底部执行,this为当前dom，a代表移动的距离，b代表总的滑动距离
});
s.resize(); //用于添加内容或者自适应的时候，重新计算滚动条高度 
01.
02.
03.
04.
05.
06.
07.
08.
09.

看个例子，默认滚动：

（更多…）