导航栏的横向下拉菜单

Question

为什么我的下拉菜单不隐藏啊，
求高手啊

Answer 1

你默认的就是显示的啊。。增加下面2个样式，默认隐藏，li:hover的时候再显示出来

 .menu2_div{margin:0px;font-size:13px;display:none}/*默认隐藏*/
.menu2 li:hover .menu2_div{display:block}/*hover时在显示*/

Answer 2

.menu2{float:left;font-size: 16px;font-family: "微软雅黑";width: 760px;}
.menu2 ul{margin:0px;padding:0px;list-style-type:none;}
.menu2 ul li{float:left;text-align:center;width:119px;}
.menu2 ul li a{display:block;text-decoration:none;color:#000000; width:119px; height:40px;line-height:40px;}
.menu2 ul li:hover a{color:#FFFFFF;background:#FF6600;text-decoration:none;}
.menu2_div{margin:0px;font-size:13px;}
.menu2 ul li ul{width:476px;list-style-type:none;}
.menu2 ul li ul li{float:left;width:119px;text-align:center;}
.menu2 ul li:hover ul li a{background:#FF6600;color:#FFFFFF; width:119px;text-decoration:none;}
.menu2 ul li:hover ul li a:hover{background:#FF9900;color:#FFFFFF;text-decoration:none;}
.menu2 ul li a.current{background:#FF6600;color:#FFFFFF;}

 <div class="menu2">
        <ul>
          <li><a href="#" class="current">首页</a></li>
          <li><a href="#">中心介绍</a>
          <div class="menu2_div">
            <ul>
              <li><a href="#">中心概况</a></li>
              <li><a href="#">中心概况</a></li>
              <li><a href="#">中心概况</a></li>
              <li><a href="#">中心概况</a></li>
            </ul>
          </div>
          </li>
          <li><a href="#">实践教学</a>
          <div class="menu2_div">
            <ul>
              <li><a href="#">教学理念</a></li>
              <li><a href="#">教学理念</a></li>
              <li><a href="#">教学理念</a></li>
              <li><a href="#">教学理念</a></li>
            </ul>
          </div>
          </li>
          <li><a href="#">教学管理</a>
          <div class="menu2_div">
            <ul>
              <li><a href="#">成果展示</a></li>
              <li><a href="#">成果展示</a></li>
              <li><a href="#">成果展示</a></li>
              <li><a href="#">成果展示</a></li>
            </ul>
          </div>
          </li>
          <li><a href="#">管理制度</a>
          <div class="menu2_div">
            <ul>
              <li><a href="#">规章制度</a></li>
              <li><a href="#">规章制度</a></li>
              <li><a href="#">规章制度</a></li>
              <li><a href="#">规章制度</a></li>
            </ul>
          </div>
          </li>
          <li><a href="#">学院管理</a>
          <div class="menu2_div">
            <ul>
              <li><a href="#">管理学院</a></li>
              <li><a href="#">管理学院</a></li>
              <li><a href="#">管理学院</a></li>
              <li><a href="#">管理学院</a></li>
            </ul>
          </div>
          </li>
        </ul>
      </div>

Answer 3

.menu2{float:left;font-size: 16px;font-family: "微软雅黑";width: 760px;}
.menu2 ul{margin:0px;padding:0px;list-style-type:none;}
.menu2 ul li{float:left;text-align:center;width:119px;}
.menu2 ul li a{display:block;text-decoration:none;color:#000000; width:119px; height:40px;line-height:40px;}
.menu2 ul li:hover a{color:#FFFFFF;background:#FF6600;text-decoration:none;}
.menu2_div{margin:0px;font-size:13px;}
.menu2 ul li ul{width:476px;display:none;}
.menu2 ul li ul li{float:left;width:119px;text-align:center;}
.menu2 ul li:hover ul li a{background:#FF6600;color:#FFFFFF; width:119px;text-decoration:none;}
.menu2 ul li:hover ul li a:hover{background:#FF9900;color:#FFFFFF;text-decoration:none;}
.menu2 ul li a.current{background:#FF6600;color:#FFFFFF;}

• 首页
• 中心介绍
  • 中心概况
  • 中心概况
  • 中心概况
  • 中心概况

        </li>
        <li><a href="#">实践教学</a>
        <div class="menu2_div">
          <ul>
            <li><a href="#">教学理念</a></li>
            <li><a href="#">教学理念</a></li>
            <li><a href="#">教学理念</a></li>
            <li><a href="#">教学理念</a></li>
          </ul>
        </div>
        </li>
        <li><a href="#">教学管理</a>
        <div class="menu2_div">
          <ul>
            <li><a href="#">成果展示</a></li>
            <li><a href="#">成果展示</a></li>
            <li><a href="#">成果展示</a></li>
            <li><a href="#">成果展示</a></li>
          </ul>
        </div>
        </li>
        <li><a href="#">管理制度</a>
        <div class="menu2_div">
          <ul>
            <li><a href="#">规章制度</a></li>
            <li><a href="#">规章制度</a></li>
            <li><a href="#">规章制度</a></li>
            <li><a href="#">规章制度</a></li>
          </ul>
        </div>
        </li>
        <li><a href="#">学院管理</a>
        <div class="menu2_div">
          <ul>
            <li><a href="#">管理学院</a></li>
            <li><a href="#">管理学院</a></li>
            <li><a href="#">管理学院</a></li>
            <li><a href="#">管理学院</a></li>
          </ul>
        </div>
        </li>
      </ul>
    </div>
  

Answer 4

用的JS吗，是不是只加了onmouseover没有加onmouseout

Answer 5

重新发你的代码，记得用工具栏上的</>格式化一下，要不看不到源代码。。

Answer 6

好吧。。原来这是提问出来的代码。。我还以为是回答呢。。
.menu2 ul li a{display:block;
这一行限定死了，display：block 当然就不会隐藏下拉菜单中的这些内容了
想要实现hover效果可以简单的加几句JS,改变display属性