jQuery实现二级下拉菜单
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>二级下拉菜单</title>
<style>
/* 公共样式 */
body,ul,li {
margin:0;
padding: 0;
list-style: none;
}
.header-nav {
position: relative;
top: 30px;
left: 50%;
margin-left: -360px;
}
/* 一级菜单 */
.header-nav .one-nav>li{
float: left;
width: 90px;
height: 40px;
background-color: #333333;
text-align: center;
lineheight: 40px;
cursor: pointer;
color: #b0b0b0;
}
.header-nav .one-nav>li:hover {
background-color: #424242;
color: #ffffff;
}
/* 二级菜单 */
.header-nav .one-nav .two-nav {
display: none;
}
.header-nav .one-nav .two-nav>li {
background-color: #424242;
border-bottom: 1px solid black;
}
</style>
<script src="public/jquery.min.js"><