0

div 标签有一个背景图片，我想把覆盖放在主标签的背景图片上，其余的内容放在它们上面。但是下面的代码会将覆盖标签放在内容上。

HTML：

<div id="nav-section">
    <div class="overlay"></div>
    <div class="container">
        <p>test</p>
        <h5>test</h5>
    </div>
</div>

CSS：

#nav-section{
background-image: url('../img/1.jpg');
background-position: top center;
background-size: cover;
position: relative;
}

#nav-section .overlay{
position: absolute;
top: 0;
height: 100%;
width:100%;
background-color: rgba(0,0,0,0.9);
z-index: 1;
}

#nav-section .container{
height: 600px;
}

#nav-section .container ul li{
float: left;
}

提前致谢。

4

2 回答 2

1

使用 z 索引。

给#nav-section .container z-index，它高于你希望他覆盖的 div。

于 2013-01-20T09:16:45.030 回答
1

使#nav-section .containerz-index 具有高于叠加层的相对或绝对位置。

于 2013-01-20T07:34:58.873 回答