我做了一个导航栏,它有一些标签,但我想做一个下拉菜单,出现在悬停在流派标签。代码是这样的:导航中的HTML下拉菜单
<nav>
<ul>
<li><a class="active" href="index.html">Home</a></li>
<li><a href="index.html">PLaying Now</a></li>
<li><a href="index.html">Genre</a></li>
</ul>
</nav>
而且CSS代码是:
nav { /* Navbar align */
text-align:center;
}
ul { /* Navbar settings */
display: inline-block;
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
}
li { /* Text align */
float: left;
}
li a { /* Menu variable */
display: block;
color: white;
font-size: 20px;
text-align: center;
padding: 16px 16px; /* height width */
text-decoration: none;
}
li a:hover:not(.active) { /* Tab over mouse */
background-color: #111;
}
.active { /* Tab active color */
background-color: #791519;
}
什么我必须改变,以做到这一点?
有通过这个阅读。这是相当简单的实现: http://www.w3schools.com/howto/howto_js_dropdown.asp – MSarandev
是的,我看到了,但是当我试图使它与我的代码一起工作时,我遇到了一些问题。这就是我问的原因。我想知道是否有人可以用我已有的代码来帮助我。 – xitro