导航栏在滚动后不显示导航链接

Question

我有这个导航栏，当我在我的网页顶部时它工作正常。每当我向下滚动时，它都会滚动，但我必须到顶部才能看到导航链接。还有一件事：在我的画廊页面导航栏没有覆盖页面内容（图像）。我的主页也出现了同样的问题。我什至不能使用导航链接。请帮我。html, body {    margin: 0;    padding: 0;    width: 100%;    height: 100vh;}/* h1 {    position: absolute;    top: 46%;    left: 50%;    transform: translate(-50%, -50%);    color: #000000;    font-size: 48px;    font-family: "Playfair Display";    font-weight: lighter;} *//* body{    background: #101010;} */.toggle-btn {    position: fixed;    margin: 1.4em;    padding: 1em;    width: 40px;    height: 12px;    right: 0;    z-index: 1;}span.one {    position: absolute;    width: 40px;    height: 2px;    background: rgb(105, 48, 48);    margin-right: 60px;}span.two {    position: absolute;    width: 40px;    height: 2px;    background: rgb(105, 48, 48);    margin-top: 12px;    margin-right: 60px;}.menu {    z-index: 0;    position: absolute;    background:#000000;    height: 100vh;    width: 100%;    top: -200%;}.data {    padding: 8em 0 0 2em;    text-align: left;}ul {    list-style: none;}li:first-child {    color: grey;    font-family: Poppins;    font-size: 24px;}li:not(:first-child) {    color: #fff;    font-size: 42px;}a {    text-decoration: none;    color: #cccccc;    font-family: Poppins;}**HTML**

Answer 1

您需要将 设置.menu为position: fixed;。您还需要z-index: 1;确保它覆盖其他内容。

.menu {

    z-index: 1;

    position: fixed;

    background: #000000;

    height: 100vh;

    width: 100%;

    top: -200%;

}