CSS flex 是一种伸缩布局，之前块级元素布局在同一行，可以通过display或position或float来实现，而本篇介绍一个新的方法——flex（弹性布局）。

flex 为和模型布局提供了极大地灵活性，所谓弹性布局即可根据大小判定自动伸缩。

flex相关的各个属性如下：

1、display：flex；在父盒子定义flex，子盒子才能使用flex属性

2、flex：none |flex-grow flex-shrink  flex-basis 设置子盒子的缩放比例，可以一起指定也可以单独指定。（均不可为负数）

（1）none 相当于 flex： 0 0 auto；

　　（2）flex-grow 用来规定盒子的扩展比率，即盒子相对于其他盒子能够分配到的空间的比值，没有指定flex的不参与分配。