z-index: number
    设置元素的堆叠顺序
    数值越大，元素越靠上
    元素必须具有绝对定位属性

4.伸缩盒布局
    display:flex;
        将当前盒子变成一个可伸缩的盒子，所有子元素默认自动成为该盒子的成员项item
        子元素的浮动属性失效
    父元素
        flex-direction:row;/row-reverse/column/column-reverse 
        flex-wrap:wrap;
    速写：
         flex-flow: row wrap;

    align-items:
        设置子元素在y轴上如何显示
        center:y轴中心位置
        stretch:默认拉伸全部
        flex-start:
        flex-end;

    justify-content: 
        设置子元素在x轴上显示
        stretch;
        center(居中)
        flex-end 
        flex-start
        justify-content: space-between;(常用)
        space-around


    子元素：
        flex:number
        当前子元素占据父元素剩余空间的份数


如何让元素在父元素中水平或垂直居中：
    行内元素：
    ···1.text-align:center;
         line-height:height;
    块级元素：
        1.给父元素设置display:flex;
        并且设置 align-items:center 和justify-content: center 
        2.给父元素一个定位属性，子元素使用绝对定位，并且使用配合属性： top:50%;
            left: 50%;
        让子元素左上角移动到父元素的中心位置；然后再让子元素使用 margin-top: -width/2;
            margin-left:  -width/2;移动到中心位置。
        3.给父元素一个定位属性，子元素使用绝对定位，然后给子元素加上
            margin: auto;
            top: 0px;
            bottom: 0px;
            left: 0px;
            right: 0px;
        4.父元素设置伸缩盒display:flex 子元素设置margin:auto