flex布局中flex-basis, flex-shrink, flex-grow的关系
flex 属性为flex-basis, flex-shrink, flex-grow的简写
- flex-basis的优先级大于width
- flex-wrap
- 为nowrap时，若item的宽度和>总宽，flex-shrink自动生效，为1，若item的宽度和<总宽，flex-grow不会生效
- 为wrap时，根据flex-basis的长度换行
- flex为1时等同于
- flex-grow: 1;
- flex-shrink: 1;
- flex-basis: 0%;
- flex为0时等同于
- flex-grow: 0;
- flex-shrink: 1;
- flex-basis: 0%;
- flex为两个正数，例如（2 3）时等同于
- flex-grow: 2;
- flex-shrink: 3;
- flex-basis: 0%;
总结
- 层叠上下文，层叠等级
- 层叠等级的比较需要在同一层叠上下文的情况下进行比较才有效
- 在同一层叠上下文下，根据z-index的大小判断层级关系