本文是个人学习笔记，不具有参考价值，请谨慎查看。

flexBox弹性盒子.按照行或列布局方案。属于一维布局

比较：grid布局是二维布局。兼容性小。flex布局用的多，兼容性比较好。

display：flex开启弹性布局。

display:  inline-flex或flex（大部分用的）

用于标准流的属性：block / inline-block/inline/none

用于弹性盒子：inline-flex，flex

模型:::

主轴方向默认从左往右。交叉轴是从上往下。

flex-wrap: nowrap 不换行 wrap换行

flex-container和flex-item有如下的属性：

flex-direction： 方向 属性，决定主轴的方向。

flex-flow: 是flex-direction和flex-wrap的简写

order:调整顺序  根据具体值来排布，默认值是0.

align-self:单独对align-item进行设置

flex-grow:决定元素如何扩展。默认值是0.决定剩余空间进行分配。如果有max-with、max-height.就有扩展上限。

flex-shrink:决定元素如何压缩。与flex-flow相反。

flex-basis:决定元素在主轴上的base size。默认是auto。根据内容单词的大小进行扩展显示。

flex:flex-grow||flex-shrink||flex-basis的简写 auto:1 1 auto；1 没有单位flex-grow 有单位flex-basis

本文是个人学习笔记，不具有参考价值，请谨慎查看。