一、flex 简单介绍
Flex 全称 Flexible box 布局模型，通常称为 flexbox 或 flex，也称为弹性盒子或弹性布局。一种比较高效率的 css3 布局方案。
既然是盒子，首先需要一个容器 container，然后是项目 item。容器包裹着项目，再通过配置不同的属性，实现各种各样的排列分布。
flex 有两根轴线，分别是主轴和交叉轴，主轴的方向由 flex-diretion 属性控制，交叉轴始终垂直于主轴。
flex 容器的属性：flex-direction
flex-direction 在前面介绍轴线的时候就提到这个，direction 是方向，指向的意思，所以这个属性主要用于改变轴线的方向。也就是项目的排列方向。
flex 容器的属性：flex-wrap
flex-wrap 有 3 个常用选项值，用于指定项目太多超过一行的时候是否换行。