项目属性
- order属性[子项目自定义顺序]
功能: 定义子项目的排列顺序,越小越靠前
可选值: 数字 默认是0
草图
- flex-grow属性[项目放大比例]
功能: 对项目进行放大
可选值: 数字 默认是0, 不放大
草图
- flex-shrink属性[项目缩小比例]
功能:对项目进行缩小
可选值: 数字 默认是1 , 0值不缩小, 负值无效
草图: 参考flex-grow推导, 图略
- flex-basis属性[项目占据的主轴空间]
功能: 对主轴上的空间进行分配
可选值:
数字,占据的比例
auto,自动适配
草图: 略
- flex属性[统一的缩放比例,占据空间,[ flex-grow flex-shrink ? || flex-basis 组合]
功能: 三个属性的组合,自由搭配
格式: {flex: 1 1 auto} 默认值为: 0 1 auto
草图: 略
- align-self属性[设置单个项目和其他项目独立开,优先align-item属性]
功能: 给项目独立设置对齐方式
可选值:
auto[默认]: 如果上级父容器存在,继承父容器,没有父容器,等同stretch
stretch ：子容器未设height或设为auto，子容器拉伸父容器次轴
flex-start：次轴的起点对齐
flex-end：次轴终点对齐
center：次轴居中对齐
baseline: 子容器和行文字［假设］的基线对齐。
草图