参考地址：阮一峰Flex布局语法篇
1、容器的属性
1.1、flex-direction 主轴方向
(row 默认值：横 | row-reverse：倒着横 | column：竖 | column-reverse：倒着竖)
1.2、flex-wrap 是否换行
(nowrap 默认值：不换 | wrap：换| wrap-reverse：换行，第一行在下面)
1.3、flex-flow 主轴方向和换行简写
(flex-direction || flex-wrap)
1.4、justify-content 主轴对齐方式
(flex-start 默认值：| flex-end | center | space-between 两端对齐，轴间隔平分 | space-around 每根轴两侧间隔相等)
1.5、align-items 交叉轴上对齐方式(纵向对齐方式)
(flex-start | flex-end | center | baseline 文字基线 | stretch 默认值:占满)
1.6、align-content 多根轴线（多行）的对齐方式
(flex-start | flex-end | center | space-between | space-around | stretch 默认值:占满)
2、项目属性
2.1、order 排序值;默认0，从小到大排序。
2.2、flex-grow 项目放大比例;
默认0：不放大。
都为1：等分剩余空间。
2~N：数值越大，剩余空间分成比例越高。
2.3、flex-shrink 项目缩小比例;
默认1：空间不足将缩小。
都为1：都等比例缩小。
一个为0,其他为1：前者不缩小。
负值无效(等同默认值)
2~N：数值越大缩的比例越多。
2.4、flex-basis 在分配多余空间之前，项目占据的主轴空间。浏览器根据这个属性，计算主轴是否有多余空间。
默认值auto:项目本身大小。
2.5、flex
flex属性是flex-grow, flex-shrink 和 flex-basis的简写，默认值为0 1 auto。后两个属性可选。
两个快捷值：auto (1 1 auto) 和 none (0 0 auto)。
2.6、align-self 单个项目有与其他项目不一样的对齐方式，
(auto | flex-start | flex-end | center | baseline | stretch)
可覆盖align-items属性。默认值为auto，表示继承父元素的align-items属性，如果没有父元素，则等同于stretch。
