flex: flex-grow flex-shrink flex-basis
# flex: 0 1 auto
三个参数分别对应的是 flex-grow, flex-shrink 和 flex-basis，默认值为0 1 auto。 1.flex-grow属性定义项目的放大比例，默认为0，即如果存在剩余空间，也不放大。 2.flex-shrink属性定义了项目的缩小比例，默认为1，即如果空间不足，该项目将缩小。 3.flex-basis属性定义了在分配多余空间之前，项目占据的主轴空间（main size）。
# z-index
z-index属性设定了一个定位元素及其后代元素或 flex 项目的 z-order。
z-index 属性指定：
- 盒子在当前堆叠上下文中的堆叠层级。
- 盒子是否创建一个本地堆叠上下文。
/* 字符值 */
z-index: auto;
/* 整数值 */
z-index: 0;
z-index: 3;
z-index: 289;
z-index: -1;/* 使用负值降低优先级 */
/* 全局值 */
z-index: inherit;
z-index: initial;
z-index: unset;
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
区分
z-index: autoz-index: 0- no
z-indexat all
Not specifying z-index is the same as z-index: auto; that is its initial value.
About z-index: 0 it's important to note the following:
z-index: 0 creates a stacking context while z-index: auto do not.
Check MDN (opens new window) for more information.
# margin
当只指定一个值时，该值会统一应用到全部四个边的外边距上。
指定两个值时，第一个值会应用于上边和下边的外边距，第二个值应用于左边和右边。
指定三个值时，第一个值应用于上边，第二个值应用于右边和左边，第三个则应用于下边的外边距。
指定四个值时，依次（顺时针方向）作为上边，右边，下边，和左边的外边距。