柔軟ポーチレイアウト：ディスプレイ：フレックス;表示：インライン -flex;（ 二つの要素が行に表示される）
アクション：制御サブ組が「メイン」に配置された
表示ルール：すべての子要素は、スピンドル上に配置されている
Xスピンドルと
x軸に設定した場合、すなわちy軸側では
yがセットスピンドルである場合、Xは側がシャフトである
親要素は、可撓性パウチ表示する必要があります：に配置されたメソッドをフレックス。
设置为display:flex;
1: 弹性盒,子元素默认在主轴排列,默认x为主轴
2: 父级元素为弹性盒,子元素都能设置宽高
3: 父元素为弹性盒,让子元素在弹性盒中上下左右居中,只需要设置margin:auto;
设置display:flex / inline-flex;对子元素的影响
子元素的float 和 clear 无效
vertical-align(元素垂直对齐方式)无效
容器(父元素)
属性:
flex-direction:;设置主轴
row 水平方向主轴
row-reverse 水平反向主轴
column 垂直主轴
column-reverse 垂直反向主轴
flex-wrap:;子元素是否换行
nowrap 不换行
wrap 换行
wrap-reverse 反向换行
flex-flow:;设置主轴 是否换行
justify-content:;子元素在主轴上的对齐方式
flex-start 起始位置
flex-end 终点位置
center 居中
space-around 完全自动分配
space-between 两端对齐,中间自动分配
align-items:;子元素在侧轴上的对齐方式
flex-start 起始位置
flex-end 终点位置
center 居中
baseline 基线对齐
stretch 默认位置对齐
align-content:;多行元素在侧轴上的对齐方式,多行元素才有效
flex-start 起始位置
flex-end 终点位置
center 居中
space-around 完全自动分配
space-between 两端对齐,中间自动分配
stretch 默认位置对齐
项目(子元素)
属性:
align-self:;子元素在侧轴上的对齐方式
flex-start 起始位置
flex-end 终点位置
center 居中
stretch 拉伸(此元素不设置宽度或者高度)
auto 默认值
注意:如果父元素有此属性设置,则继承alig-items:;属性设置
order:;数值越大,子元素越靠后
