1.最外层display: flex => 沿主轴方向排列
2.justify-content: center | flex-start | flex-end | space-between | space-around | space-evenly 控制主轴
3.align-items: center | flex-start | flex-end 控制交叉轴
4.flex-direction: row | row-reverse | column | column-reverse 控制排列方向
5.flex-wrap: nowrap | wrap | wrap-reverse 控制自动换行
6.order: 数字 控制元素排列顺序
7.align-self: center | flex-start | flex-end 可覆盖align-items,控制单个元素在交叉轴上的对齐方式