/* flex-flow: flex-direction flex-wrap;复合属性
flex-direction: 设置主轴的方向;
flex-wrap: 设置子元素是否换行; */
/* flex-direction: row默认值从左到右 （默认主轴为x轴）
row-rever从右到左
column从上到下
column-rever从下到上 */
/* flex布局中默认子元素是不换行的，如果装不开，会缩小子元素宽度
flex-wrap:nowrap 默认不换行
wrap 换行 */
/* 复合属性flex-flow:flex-direction flex-wrap
flex-flow: row nowrap;主轴x轴 子元素不换行 */
/* 主轴上子元素对齐方式 */
/* justify-content: flex-start; 左对齐
flex-end; 右对齐
center; 水平方向居中
apace-between紧靠边对齐
space-around子元素左右边距一样,相邻子元素之间距离翻倍
space-evenly子元素相邻的距离保持一致*/
/* 定义在交叉轴上的对齐方式 */
/* justify-content: center;水平方向居中 */
/* align-items: center; 垂直方向居中*/
/* align-items: flex-start;垂直方向的顶部，交叉轴的起点对齐 */
/* align-items: flex-end;垂直方向的底部，交叉轴终点对齐 */
/* baseline :项目第一行的文字的基线对齐
align-items: baseline;垂直方向按照子元素所在的位置进行对齐 */
