Html CSS修复了div元素下的导航崩溃_Html_Css

Html CSS修复了div元素下的导航崩溃

html css

Html CSS修复了div元素下的导航崩溃,html,css,Html,Css,我的导航固定在页面顶部。当我向下滚动并且不将鼠标悬停在div元素上时，一切看起来都正常。但是，当尝试从我的导航中选择某个链接时，我只从我的导航下的内容中选择一个div元素。问题在于它下面的div元素，因为每次我选择div元素时，它都会破坏我的固定导航。如果你理解这个问题，请帮助我我的html代码是 <html !DOCTYPE> <meta charset="UTF-8"> <link rel="stylesheet" href="css/style.css"&g

我的导航固定在页面顶部。当我向下滚动并且不将鼠标悬停在div元素上时，一切看起来都正常。但是，当尝试从我的导航中选择某个链接时，我只从我的导航下的内容中选择一个div元素。问题在于它下面的div元素，因为每次我选择div元素时，它都会破坏我的固定导航。如果你理解这个问题，请帮助我

我的html代码是

<html !DOCTYPE>
<meta charset="UTF-8">
<link rel="stylesheet" href="css/style.css">
<head>
</head>
<body>
<div id="navbg">
<nav>
    <ul>
        <li><a href="#"><center><img src="uploads/nav/pocetna.png"><p>Početna</p></center></a></li>
        <li><a class="select" href="#"><center><img src="uploads/nav/trgovina.png"><p>Trgovina</p></center></a></li>
        <li><a href="#"><center><img src="uploads/nav/info.png"><p>O nama</p></center></a></li>
        <li><a href="#"><center><img src="uploads/nav/mail.png"><p>Kontakt</p></center></a></li>
    </ul>
</nav>
</div>
<header>
<img id="logo" src="images/logo4.png">
</header>
<div id="clear"></div>
<section>
<h1>Trgovina</h1>
<div class="okvir">
<a href="#">
<img class="slika"src="uploads/4.jpg">
<div class="tekst">Arc de Triomphe</div>
</a>
</div>
<div class="okvir">
<img class="slika"src="uploads/1.jpg">
<div class="tekst"><a href="#">Arc de Triomphe</a></div>
</div>
<div class="okvir">
<a href="#">
<img class="slika"src="uploads/2.jpg">
<div class="tekst">Arc de Triomphe</div>
</a>
</div>
<div class="okvir">
<a href="#">
<img class="slika"src="uploads/3.jpg">
<div class="tekst">Arc de Triomphe</div>
</a>
</div>
<div class="okvir">
<a href="#">
<img class="slika"src="uploads/4.jpg">
<div class="tekst">Arc de Triomphe</div>
</a>
</div>
<div class="okvir">
<img class="slika"src="uploads/1.jpg">
<a href="#"><div class="tekst">Arc de Triomphe</div></a>
</div>
<div class="okvir">
<img class="slika"src="uploads/1.jpg">
<a href="#"><div class="tekst">Arc de Triomphe</div></a>
</div>
<div class="okvir">
<a href="#">
<img class="slika"src="uploads/2.jpg">
<div class="tekst">Arc de Triomphe</div>
</a>
</div>
<div class="okvir">
<a href="#">
<img class="slika"src="uploads/3.jpg">
<div class="tekst">Arc de Triomphe</div>
</a>
</div>
<div class="okvir">
<a href="#">
<img class="slika"src="uploads/4.jpg">
<div class="tekst">Arc de Triomphe</div>
</a>
</div>
<div class="okvir">
<img class="slika"src="uploads/1.jpg">
<a href="#"><div class="tekst">Arc de Triomphe</div></a>
</div>
<div class="okvir">
<img class="slika"src="uploads/1.jpg">
<a href="#"><div class="tekst">Arc de Triomphe</div></a>
</div>
<div class="okvir">
<a href="#">
<img class="slika"src="uploads/2.jpg">
<div class="tekst">Arc de Triomphe</div>
</a>
</div>
<div class="okvir">
<a href="#">
<img class="slika"src="uploads/3.jpg">
<div class="tekst">Arc de Triomphe</div>
</a>
</div>
<div class="okvir">
<a href="#">
<img class="slika"src="uploads/4.jpg">
<div class="tekst">Arc de Triomphe</div>
</a>
</div>
<div class="okvir">
<img class="slika"src="uploads/1.jpg">
<a href="#"><div class="tekst">Arc de Triomphe</div></a>
</div>
<div id="clear"></div>
</section>
</body>
</html>

看起来像这样的

我修好了！看：

我补充说：

#navbg {
     z-index: 100;
}

谢谢，我看到了类似的东西，z-index:999；我试过了，但没用。你的办法奏效了！谢谢你，伙计！我可以要“已回答”的标签吗？不要使用

标签，它在几年前就被弃用了。使用CSS将元素居中。

#navbg {
     z-index: 100;
}