关于前端: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;
    }