flex布局

flex布局父项常见属性
flex布局中分为主轴和侧轴两个方向，元素是按照主轴排列的。默认的主轴是X轴，侧轴是Y轴。如果选定了X轴为主轴则Y轴是侧轴，反之，Y轴是主轴，X轴是侧轴
1.flex-direction：设置主轴方向。
属性值 row（默认）X轴是主轴 按行排列
column 选定Y轴为主轴 按列排列
2.justify-content 设置子项在主轴上的排列方式
/* justify-content: center; /
/ 平分剩余空间 /
/ justify-content: space-around; /
/ 先两边贴边再平分剩余空间 /
/ justify-content: space-between; /
/ 平分空间 */
justify-content: space-evenly;
3.flex-wrap设置子元素是否换行 默认是nowrap不换行，wrap是换行显示
4.align-items设置侧轴子元素的排列方式适用于单行情况下，center（居中）、stretch（拉伸，不要给子项高度）
5.align-content设置子项在侧轴上的排列方式并且只能用于子项出现换行的情况(多行)，在单行下是没有效果的。比align-items多了space-around 和space-between两个属性
6.flex-flow 是flex-direction 和flex-wrap的复合属性 flex-flow：row wrap；
flex布局子项常见属性
1.flex属性定义子项占父项剩余空间多少份 flex：1;
2.align-self控制子项自己在侧轴上的排列方式
3.order定义子项的排列顺序 盒子默认是0 order：-1 （比0小 就跑到0前面去了）