名词解释:
容器: 一个盒子,可以理解为一个教室,这里我叫做父容器
项目: 放在一个盒子里面的一个盒子,可以理解为一张桌子,这里我叫做子容器
文章涉及内容:
12个属性,其中父容器6个属性,子容器6个属性
父容器属性flex-direction [往哪个方向排]功能：控制容器的主轴方向[教室内桌子的主要方向]
可选值：
row［默认］：水平方向，从左向右
row-reverse：水平方向，从右向左
column：垂直方向，从上到下
column-reverse：垂直方向，从下向上
草图：
flex-wrap［到头是否换行或列］
功能：子容器在父容器排列到头后是否换行
可选值：
nowrap［默认］：不换行
wrap：换行，新行在下
wrap-reverse：换行，新行在上
草图：
flex-flow［flex-direction和flex-wrap的合并］
上图写法：{ flex-flow: row wap }
justify-content［主轴上怎么对齐］功能：子容器在主轴上的对齐方式
可选值：
flex-start［默认］：左对齐
flex-end：右对齐
center： 居中
space-between：两端对齐，子容器之间的距离间隔相等
space-around：每个项目两侧的间隔相等
草图：
align-items［次轴上怎么对齐］
功能：子容器在次轴［副主轴］上怎么对齐
可选值：
stretch［默认值］：子容器未设height或设为auto，子容器拉伸父容器次轴
flex-start：次轴的起点对齐
flex-end：次轴终点对齐
center：次轴居中对齐
baseline: 子容器和行文字［假设］的基线对齐。
草图：
align-content［主次轴同时设置怎么对齐］
功能：只设置一个轴，参数失效
可选值：
stretch［默认值］：主次轴铺满
flex-start：次轴起点对齐。
flex-end：次轴终点对齐。
center：次轴中点对齐。
space-between：次轴两端对齐，距离间隔相等。
space-around：每根轴线两侧的间隔都相等
草图：
