移动Web-主轴方向的切换+弹性盒子换行+多行侧轴对齐方式

主轴方向的切换（flex-direction）

主轴默认是水平方向, 侧轴默认是垂直方向

修改主轴方向属性

• flex-direction

值

• row

  • 行, 水平(默认值)

• column

  • 列, 垂直

• row-reverse

  • 行, 从右向左

• column-reverscolumn-reverse

  • 列, 从下向上

弹性盒子换行

弹性盒子换行显示

• flex-wrap: wrap;

调整行对齐方式

• align-content

多行侧轴对齐方式（align-content）

取值与justify-content基本相同

取值

• stretch

  • 拉伸

    • 默认值

• flex-start

  • 起点开始依次排列

• flex-end

  • 终点开始依次排列

• center

  • 居中

• space-between

  • 两端对齐

• space-around

  • 弹性盒子沿主轴均匀排列, 空白间距均分在相邻盒子之间

• space-evenly

  • 等分间隙