三种在浏览器上下左右居中方法

.one{position: absolute;top: 50%;width: 200px;height: 200px;left: 50%;border: 1px solid red;margin-top: -100px;margin-left: -100px;}
.two{
    width: 50%;
    height: 50%;
    background: #f00;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
}

<div class="one">1</div>
<div class="two">2</div>

以上是确定宽高的情况下上下左右居中

下面介绍一种不确定宽高居中

.div{
    position: fixed;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
}

<div class="div">12323</div>