我想做一个下拉菜单,但不知道如何
问题描述:
我看了其他问题,不能得到它的工作,这里是我的HTML和CSS(随时更改或删除代码,使其更多紧凑)。我想做一个下拉菜单,但不知道如何
.dropdown-menu li ul {
display: none;
height: auto;
margin: 0;
padding: 0;
display: table;
}
.dropdown-menu li:hover ul {
display: block;
height: auto;
margin: 0;
padding: 0;
display: table-cell;
}
<div class="nav">
<div class="container">
<ul class="pull-left">
<li><a href="index.html">Home</a>
</li>
<li><a href="#">Contact Us</a>
<ul class="dropdown-menu">
<li><a href="contact.html">Contact Us</a>
</li>
<li><a href="request.html">Request a building</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
答
你应该在顶层ul
使用它,而不是在下降,itseld。同时删除display
财产的重新声明:
ul{
list-style: none;
}
.pull-left > li{
float: left;
margin: 0 20px;
overflow: hidden;
}
.pull-left > li > ul {
display: none;
height: auto;
margin: 0;
padding: 0;
}
.pull-left > li:hover > ul {
display: block;
height: auto;
margin: 0;
padding: 0;
}
<div class="nav">
<div class="container">
<ul class="pull-left">
<li><a href="index.html">Home</a></li>
<li><a href="#">Contact Us</a>
<ul class="dropdown-menu">
<li><a href="contact.html">Contact Us</a></li>
<li><a href="request.html">Request a building</a></li>
</ul>
</li>
</ul>
</div>
</div>
+0
好了,现在我把它放在body元素或其他元素? –
+0
这取决于你自己的情况和布局。我强烈建议提出另一个问题,并让所有人都帮助你,因为它是单独的问题 – Trix
+0
如果我将酒吧保持在顶部,我可以使用它吗? –
尝试两个片段结合起来,一个 – Trix