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/

发现它搜索谷歌10秒钟。

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

使用CSS创建子菜单

1 个答案: