伸缩容器的属性
1.display
- flex 块级伸缩容器
- inline-flex 行内级伸缩容器
2.flex-direction(方向)
- row 从左到右的方向
- row-reverse 相反的方向（从右刀左）
- column 从上到下的方向
- column-reverse 从下到方向
3.flex-wrap (伸缩容器在主轴线方向空间不足的情况下，是否换行及其如何换行）
- wrap 自动换行
- norap 不管怎样不换行
- wrop-reverse 自动换行 以反方向换
4.flex-flow(是flex-direction和flex-wrap的缩写）默认值是 row nowrap （横向，不缩）
5.justify-content(在主轴线上的对齐方式)
- flex-start 左对齐（起始位置）
- flex-end 右对齐
- center 中间对齐
- space-between 平均分布在界面上
- space-around 中间的间距=两边的边距相加
6.align-items（交叉轴的对齐方式）
- flex-start 已交叉轴开始的位置对齐
- flex-end 以交叉轴结束的位置进行对齐
- baseline 以基准线对齐
- stretch 已拉伸的效果展示
7.align-content 换行后在交叉轴上的对齐方式 前提是要开启换行
- flex-start （起始位置）
- flex-end （结束位置）
- center 中间对齐
- space-between 平均分布在界面上
- space-around 中间的间距=两边的边距相加
- stretch 默认值 已拉伸的效果展示
[传送门 ] ()
Top