html代码
<div class="menu"> <ul> <li><a href="#" class="bccolor">首页</a></li> <li><a href="#">关于我们</a> <ul> <li><a href="#">公司简介</a></li> <li><a href="#">人才招聘</a></li> <li><a href="#">联系我们</a></li> </ul> </li> <li><a href="#">新闻中心</a> <ul> <li><a href="#">最新资讯</a></li> <li><a href="#">行业新闻</a></li> <li><a href="#">公司公告</a></li> </ul> </li> <li><a href="#">联系我们</a></li> </ul> </div>css代码
body{margin:0px;padding:0px;} ul;li{list-style:none;} a{display:block;} a:link,a:visited{text-decoration: none;color:#000000;} .menu{margin:0px auto;width:600px;height:30px;} .menu ul{margin:0px;padding:0px;} .menu ul li{position:relative;float:left;list-style:none; font-size:14px;width:100px;text-align: center;line-height:30px; margin-right:1px;background:#999999; } .menu ul li .bccolor{color:red; font-weight:bold;} .menu ul li ul{display:none;} .menu ul li ul li{margin-top:1px} .menu ul li:hover{background:red;} .menu ul li a:hover{color:#fff;} .menu ul li:hover ul{display:block;position: absolute; left: 0px; top: 30px;}效果图：
