django 下拉菜单html,Html下拉菜单 - 周海生的个人页面 - OSCHINA - 中文开源技术交流社区...

this is a test file

#head,#foot{

width: 960px;

height: 100px;

margin: 0px auto;

}

body{

margin: 0px;

padding: 0px;

font-size: 14px;

font-family: "微软雅黑",Helvetica,arial;

}

/**

* darker:#06a18a;

* light: #0fb89f;

*/

div.navbar{

background-color:#0fb89f ;

}

ul.nav{

margin: 0px auto;

padding: 0px;

list-style: none;

width: 960px;

height: 40px;

}

ul.nav a{

text-decoration: none;

color: white;

display: inline-block;

padding: 10px;

min-width: 110px;

text-align: center;

}

ul.nav a:hover{

background-color: #06a18a;

}

a.active{

background-color: #06a18a;

}

ul.nav li{

float: left;

}

ul.nav li ul{

margin: 0px auto;

padding: 0px;

list-style: none;

background-color: #06a18a;

display: none;

}

ul.nav li ul li{

float: none;

}

ul.nav li ul li a:hover{

background-color:#0fb89f ;

}

this is head

• 首页

• 中心概况

  • 中心简介

  • 历任领导

  • 现任领导

  • 组织架构

• 新闻公告

  • 集团要闻

  • 综合新闻

  • 通知公告

  • 媒体关注

• 经营发展

• 社会责任

• 企业文化

• 专项工作

• 投资者关系

$(document).ready(function(){

$("ul.nav").children().hover(function() {

if($(this).find("li").length > 0){

$(this).children("ul").stop(true, true).slideDown(100)

}

},function() {

$(this).children("ul").stop(true, true).slideUp("fast");

});

$("ul.nav ul").hover(function(){

$(this).prev().addClass("active");

},function(){

$(this).prev().removeClass("active");

})

});