html - CSS/HTML - 居中绝对定位图像

Question

我已经用了很长一段时间了，但似乎无法掌握它。我想知道如何使我的“.logo”类居中？

#wrap {
    width: 960px;
    height: auto;
    min-height: 700px;
    margin: 0 auto;
}

.logo {
    background: url(../images/logo.png);
    width: 269px;
    height: 126px;
    z-index: 1000;
    position: absolute;
}        

<div id="wrap">
    <div class="logo"></div>
    <div id="nav"></div>
</div>

提前致谢!

Answer 1

因为你有一个固定宽度的容器来容纳绝对元素，你真正需要做的就是添加:

left: 50%;
margin-left: -134px;

加入 .logo 就可以了。 margin-left 应该是绝对元素宽度的 1/2。这个，假设你只是为了一个水平中心。垂直与顶部/边距顶部的工作方式类似，但需要固定高度。