修復了CSS位置，導致內容重疊

Question

我正在制作一個靜態網站，我將導航菜單固定在頂部為固定標題部分。

問題出在我旁邊添加的任何內容都重疊在菜單頂部。

向內容添加相對位置的行為相同。

將位置設置為絕對顯然是唯一可行的方法，但隨后我將不得不添加大量的邊距，這將使站點過於不穩定。

這是我的菜單CSS，由於這個問題，我的主CSS中沒有任何東西。

nav {
    position: fixed;
    top: 0;
    background:none;
    z-index:10000;
    width:100%;
    font-size:34px;
    transition: all 0.5s;
}

nav.navScroll {
    background: #013D5F;
    font-size:20px;
    transition: all 0.5s;
    color: #fff;
}

img.logo {
    float:left;
    display:none;
    transition: all 0.5s;
}

img.logoScroll {
    display:inline;
    width:50px;
    padding:5px;
    transition:all 0.5s;
}

div.menu {
    text-align:center;
}

div.menuScroll {
    float:right;
}

ul {
    padding-left:0;
    margin-left:0;
}

li.nav {
    display:inline;
    text-decoration:none;
    padding-left:15px;
}

    li.nav a {
        list-style-type: none;
        text-decoration:none;
        color: white;
        font-weight:400;
    }

    li.nav a:hover {
        color: #FFD634;
        transition: 1.2s;
    }

.navScroll li.nav a {
    color:#fff;
}

.navScroll li.nav a.selected {
    color: #FFD634;
}

Answer 1

Jaromanda X正確指示固定位置元素已從流程中取出。 您必須在頁面正文或主容器中添加一個等於nav元素高度的邊距。 您的“ z-index：10000;” 會阻止任何滾動元素掩蓋您的導航，只要沒有賦予更高的z-index；）