CSS固定顶部菜单导航在某些项目下

Question

我的网站遇到问题： 我试图固定上方菜单，现在在浏览网站时，所有标题和段落都位于菜单上方：

这是问题的图片

这是固定顶部菜单的HTML

<div class="topnav" id="myTopnav">
        <a href="#" class="active">Home</a>
        <a href="#">About</a>
        <a href="#">Menu1</a>
        <a href="#">Menu2</a>
    </div>

这是顶部固定菜单的CSS

.topnav {
background-color: #333;
overflow: hidden;
position: fixed; /* Set the navbar to fixed position */
top: 0; /* Position the navbar at the top of the page */
width: 100%; /* Full width */
}

所以问题将是：如何使它位于一切之上？

Answer 1

.topnav {
    background-color: #333;
    overflow: hidden;
    z-index: 100; /* or 999 */
    position: fixed; /* Set the navbar to fixed position */
    top: 0; /* Position the navbar at the top of the page */
    width: 100%; /* Full width */
}

Answer 2

尝试将“ z-index”设置为更高的值