序：
考虑到实际开发中，写样式的机会不多，但是不可能不写，脑子容量总是不够用，每次都查，这次自己就总结下，方便下次查找（举例以下常用六个属性，语法都是加在父元素身上的）。
1、flex-direction: row; 布局的排列方向 （主轴排列方向）
row ：显示为行。方向为当前文档水平流方向，默认情况下是从左往右（默认值）;row-reverse ：显示为行。但方向和row属性值是反的，在水平方向上为从右往左；column： 显示为列 方向为在垂直方向上从上到下；column-reverse ：显示为列。但方向和column属性值是反的。
2、flex-wrap : nowrap; 是否进行换行处理。此语法是加在父元素身上的。
nowrap：默认值，不换行处理；wrap： 换行处理；wrap-reverse： 反向换行；flex-flow : flex-direction flex-wrap 复合写法 (是有顺序的，顺序一定不能乱)。
3、justify-content ; 属性决定了主轴方向上子项的对齐和分布方式。
flex-start ： 左对齐（默认）；flex-end ： 右对齐；center ： 居中；space-between : 两端对齐，项目之间的间隔都相等；space-around : 每个项目两侧的间隔相等。所以，项目之间的间隔比项目与边框的间隔大一倍。space-evenly : evenly是匀称、平等的意思。也就是视觉上，每个flex子项两侧空白间距完全相等。
4、align-items : 每一行中的子元素上下对齐方式。
stretch：如果项目未设置高度或设为auto，将占满整个容器的高度（默认值）
flex-start：顶部对齐
center：居中对齐
flex-end：底部对齐
baseline：项目的第一行文字的基线对齐
5、align-content :
与justify-content相反的操作。侧轴的对齐方式。(最少需要两行才能看出效果，因为他是多行的一个上下对齐方式)
stretch：轴线占满整个交叉轴（默认值）；
flex-start：与交叉轴的起点对齐；
flex-end：与交叉轴的终点对齐；
center：与交叉轴的中点对齐；
space-between：与交叉轴两端对齐，轴线之间的间隔平均分布；
space-around：每根轴线两侧的间隔都相等。所以，轴线之间的间隔比轴线与边框的间隔大一倍；
6、flex-shrink
项目的缩小比例，默认为1，即如果空间不足，该项目将缩小。
如果所有项目的flex-shrink属性都为1，当空间不足时，都将等比例缩小。
如果一个项目的flex-shrink属性为0，其他项目都为1，则空间不足时，前者不缩小。
负值对该属性无效
7、注意事项
①、默认情况下，在弹性盒子中的子元素的左右排列的。
②、水平是主轴的时候：默认情况下，当宽高不写的时候，宽度由内容决定，高度由父容器决定。
③、垂直是主轴的时候：默认情况下，当宽高不写的时候，宽度由父容器决定，高度由内容决定。
④、当子项的总宽度大于父容器的时候，会自动收缩的（弹性的优先级是大于自身固定大小的）
⑤、当子项的内容已经达到了父容器最小宽高的时候，就会出现溢出的现象。
