关于前端:css设置一个盒子水平垂直居中的方法

这里介绍三种办法：

 已知盒子的宽度，高度：div{
        position:absolute;
        width:500px;
        height:500px;
        margin:auto;
        top:0;
        left:0;
        buttom:0;
        right:0;
    }

 这是一个经典办法：.parent{position:relative;}
    .child{
        width:500px;/* 能够不晓得宽高 */
        height:500px;
        positon:absolute;
        top:50%;/* 绝对于父级的 50%*/
        left:50%;/* 绝对父级的 50%*/
        transform:translate(-50%,-50%);/* 绝对于本身的 50%*/
    }

 应用 css3 的 flex 布局
    div{
        display:flex;
        juestify-content:center;
        align-items:center;
    }