有没有办法让我的导航栏摆在一切前面？

Question

您好，我正在制作一个带有导航栏的网站，但是我发现当我向下滚动一个div时会与导航栏重叠。这是代码：

<ul>
<li><a href="404.html"><button class=nav>Home</button></a></li>
<li><a href="#"><button class=nav>Contact Us</button></a></li>
<li><a href="#"><button class=nav>Web Development</button></a></li>
<li><a href="#"><button class=nav>Editing</button></a></li>

.nav {
border: none;
padding-left: 25px;
padding-right: 25px;
padding-top: 25px;
padding-bottom: 25px;
background-color: black;
color: white;
border-radius: 100px;
transition: 1s;
z-index: 999;
}

.nav:hover {
 color: black;
 background-color: white;
 transition: 1s;
}`

在Codepen上查看

https://codepen.io/adsnipers/pen/PdNOYx?editors=1100#0

Div appears over navbar

Answer 1

您可以将导航栏的z-index设置为10000

Answer 2

只需将此行添加到CSS文件中即可。

z-index: 999;

有关更多信息，请参见此链接MDN Docs - z-index