卡住了使用 CSS 创建子菜单

Question

我对 css 和 html 很陌生，我使用 css 设计了一个菜单，即使在互联网上搜索了很多之后，我也找不到向其中添加子菜单的方法。他们永远不会出现，甚至他们会与我的水平菜单重叠而不是垂直

这是我的菜单的 css ：

#top-menu { float: left; width: 1000px; height:51px; margin-top: -30px; margin-left: 250px;  }


#top-menu ul {  list-style: none;text-align:center;
}

#top-menu li a{ position: relative; float :left;
display: block;
height: 32px;
width: 100px;
padding-top: 15px;
color: #444;
text-transform: none;
font-size: 12px;
font-weight: bold;

}

#top-menu li a:hover {
color: #f4f4f4;
background: #222;
border-bottom: 4px solid #22aed6; font-weight: bold;}

#top-menu li .active {
color: white;
background: #22aed6;
border-bottom: 4px solid #22aed6;}

和html代码：

<div id="top-menu">
<ul>
    <li><a href="index.html" class="active">Home</a></li>
    <li><a href="about.html">About Us</a></li>
    <li><a href="ff.html">Featured</a></li>
    <li><a href="f-e.html">Fests</a></li>
    <li><a href="fye.html">find</a></li>
    <li><a href="tip-us.html">tip US</a></li>
    <li><a href="adwus.html">Advertise</a></li>
    <li><a href="contactus.html">Contact Us</a></li>
</ul>

请帮我创建子菜单！

我网站的链接是http://eventsindu.com（旧设计） http://eventsindu.com/test（正在开发的新设计）

Answer 1

要制作子菜单，只需这样做。

<ul id="mainMenu">
    <li><a>blabla</a>
         <ul id="subMenu">
             <li><a>blabla2</a></li>
         </ul>
    </li>
</ul>

去看看这个CSS代码和更深入的http://jsfiddle.net/BVvc6/1/

在 google 上搜索了 10 秒发现它。

How to add second level to a submenu in a dropdown navigation css