关于Flex布局

    display:flex;
<!-- 水平(主轴) -->
    justify-content:center;					<!-- 子盒子居中对齐 -->
    justify-content:space-between;    <!-- 空间出现在子盒子之间 -->
    justify-content:space-evenly;       <!-- 所有地方的间距都相等 -->
    justify-content:space-around;      <!--空间出现在子盒子的两侧 -->
<!-- 垂直(侧轴) -->
    align-item:center;  <!-- 垂直居中 -->
    align-item:streth;  <!-- 默认值，拉伸 -->
    align-self:center;  <!-- 单独设置某个盒子 -->
<!-- 主轴方向 -->
    flex-direction:row;   (默认)
    flex-direction:column;  (垂直方向变为主轴,水平方向变为侧轴)
<!-- flex -->
    flex:1;     <!-- 把剩余的空间分成1+2份,这个标签所在的盒子占一份 -->
    flex:2;
<!-- 弹性布局(写到父级盒子) -->
    flex-wrap:wrap;
    flex-wrap:nowrap; (默认值)