gpt4 book ai didi

html - CSS - 下拉菜单

转载 作者:太空宇宙 更新时间:2023-11-04 12:54:12 25 4
gpt4 key购买 nike

我是 CSS 的新手,正在测试一些东西。我创建了一个下拉菜单,但这不能正常工作。这是我的代码:

 <!DOCTYPE html>
<html>

<head>
<link href = "üben_css.css" rel = "stylesheet" type="text/css">
<title> xx</title>
</head>

<body>


<div id="nav">
<ul>
<li> Home </li>
<li> xx
<ul>
<li> Hc </li>
<li> Scc </li>
</ul>
<li>Zubehör </li>
<li> Service </li>
<li> Forum </li>

</ul>
</div>



</body>

</html>

CSS 代码:

  body{
margin:0;
padding:0;
}

#nav{
background-color:silver;
position:relative;
}

#nav ul li{

display:inline;
}

#nav ul ul{
display:none;
}

#nav ul li:hover ul{
display:block;
}

#nav ul ul li{
display:block;
}

问题是导航栏是内联显示的,但是当我将鼠标悬停在我的“xx”元素上时,我的导航栏的其余部分出现在我的下拉列表下方。我怎样才能解决这个问题?

http://www.fotos-hochladen.net/uploads/20140921004u0kxad3i2r.png

最佳答案

从您的 CSS 中删除这些行:

#nav ul li:hover ul{
display:block;
}

关于html - CSS - 下拉菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25954503/

25 4 0