Question

导航栏代码

ul {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    list-style-type: none;
    background: black;
    margin: 0;
    padding: 0;
}

li {
    float: left;
    padding: 25px 25px;
    cursor: pointer;
}

a {
    text-decoration: none;
    color: white;
    font-size: large;
}

和图像代码

.image {
    position: relative;
    left: 500px;
    overflow: hidden;

所以当我滚动文字时，会平滑地隐藏在导航栏后面。但enter image description here图片与导航栏重叠

现在，在我的右边，有类似的问题＆＃39;也与底部黑色div重叠

Answer 1

您应该为ul设置一个z-index，并确保它高于其他元素。

Answer 2

您需要在高于内容滚动的主导航中添加z-index。如上所述。

但是你也在图像上使用position: relative，如果你也将其父项位置设置为相对位置，那么图像将保留在主内容包装器中，并在菜单下方滚动其余内容

图片重叠我的导航栏

2 个答案: