CSS用position:absolute后如何让元素居中 CSS绝对定位居中方法

在使用CSS过程中，我们经常会遇到绝对定位居中的问题，具体可以参考以下代码，在此做个记录，目前在谷歌浏览器测试正常。：

代码一：

.box{
    width: 600px; height: 400px;
    position: absolute; left: 50%; top: 50%;
    transform: translate(-50%, -50%);    /* 50%为自身尺寸的一半 */
}

代码二：

.box{
    width: 600px; height: 400px;
    position: absolute; left: 0; top: 0; right: 0; bottom: 0;
    margin: auto;    /* 有了这个就自动居中了 */
}

共有0条评论

昵称/用户名:

验证码:

密码: 匿名