一、

通过给top: 50%;left: 50%;看起来居中了,但是这个50%是从左上角的点开始计算的,所以用transform:translate(-50%,-50%);将div左移动-50%上移动-50将div的中心点对准左上角的点就可以实现居中了。

transform: translate(-50%,-50%);
            position: absolute;
            top: 50%;
            left: 50%;