flex-direction:设置主轴的方向(即项目的排列方向)。
内有四个值:
row(默认值):主轴为水平方向,起点在左端。
row-reverse:主轴为水平方向,起点在右端。
column:主轴为垂直方向,起点在上沿
column-reverse:主轴为垂直方向,起点在下沿
justify-content:设置主轴上的子元素排列方式。
内有五个值:
flex-start(默认值):左对齐
flex-end:右对齐
center: 居中
space-between:两端对齐,项目之间的间隔都相等。
space-around:每个项目两侧的间隔相等。所以,项目之间的间隔比项目与边框的间隔大一倍
flex-wrap:设置子元素是否换行
内有三个值:
nowrap(默认):不换行
wrap:换行,第一行在上方
wrap-reverse:换行,第一行在下方