我试图制作一个简单的 CSS 下拉菜单。当您将鼠标悬停在链接上时,我无法实现下拉子菜单。下面是我的html和css规则,谢谢。
ul#menu li
{
position:relative;
list-style-type:none;
float: left;
padding:0px;
width: 125px;
height: 25px;
}
ul#sub1 li
{
position:absolute;
left:0;
width:125px;
visibility: hidden;
}
ul#menu li:hover #sub1
{
visibility:visible;
}
<ul id="menu">
<li><a href="#">Hyperlink 1</a></li>
<li><a href="#">Hyperlink 2</a>
<ul id="sub1">
<li><a href="#">Hyperlink 2.1</a></li>
<li><a href="#">Hyperlink 2.2</a></li>
</ul>
</li>
<li><a href="#">Hyperlink 3</a></li>
<li><a href="#">Hyperlink 4</a></li>
</ul>