0

我想在主菜单的“”选项卡中添加一个下拉about us菜单，我努力了但它没有显示，

这是列表的 html 代码，

<li>
       <a href="aboutus.php">About Us</a>  
          <ul class="sub-menu">
              <li><a href="#">Menu 1</a></li>
              <li><a href="#">Menu 2</a></li>
              <li><a href="#">Menu 3</a></li>
          </ul>
   </li>

这是我创建的下拉菜单的CSS：

#menu ul li{float:none}
#menu ul li a{background:none !important;}
#menu ul li a:hover{background:url(../images/menu_active.gif) top repeat-x !important;display:block}
#menu ul{border:solid 1px #FC0;position: absolute;z-index: 100;background: #000;width:300px;display:none}
4

2 回答 2

1

在这个小提琴中是您的代码的工作版本：

提琴手

解释：

你没有<ul>在你的CSS中选择写

    #menu ul li:hover ul{background:url(../images/menu_active.gif) top repeat-x !important;display:block;}
    #menu ul li ul{border:solid 1px #FC0;z-index:999;background: #000;width:300px;display:none;}

检查 JSFiddle 的完整代码

如果您想在<li>a<ul>中选择 a<ul>或<li>在您的 css 中使用它。

ul li ul li {}
于 2013-06-17T12:29:41.653 回答
0

这是纯 CSS 中的下拉示例。

.sub-menu { display: none; }
.menu:hover + .sub-menu { display: block; }

http://jsfiddle.net/greatghoul/TDA62/

于 2013-06-17T12:21:45.750 回答