修复了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；）