类似新浪网的黑色导航菜单代码
代码简介：仿新浪网的一款黑色背景的网站导航菜单，采用DL、DL表格布局的风格，也可借机研究一下DD、DL是如何使用的，个人建议，最好是将DD、DL换为LI结构，这样更习惯一些，更多人会很容易接受。代码内容：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>类似新浪网的黑色导航菜单代码_网页代码站(www.webdm.cn)</title>
<style type="text/css">
body{ font-size:12px; background:#000; color:#fff;}
.nav{ float:left; width:100%; text-align:center;}
.nav *{ margin:0; padding:0; list-style:none;}
.nav ul{ width:100%; overflow:hidden;}
.nav li{ float:left; width:14.2%; margin:1px 0 1px -1px; border-left:solid 1px #f0f0f0;}
.nav li dl{ overflow:hidden;}
.nav li dt,.nav li dd{ float:left; width:33%; margin:5px 0 5px -1px; line-height:14px; border-left: dotted 1px
#eee;}
.nav li dt{ font-weight:bold;}
a:link,a:visited{ color:#fff; text-decoration:none}
a:hover{ color:#f60; text-decoration: none;}
</style>
</head>
<body>
<div class="nav">
<ul>
<li>
<dl>
<dt><a href="javascript:void(0)">新闻</a></dt>
<dd><a href="javascript:void(0)">军事</a></dd>
<dd><a href="javascript:void(0)">社会</a></dd>
<dd><a href="javascript:void(0)">财经</a></dd>
<dt><a href="http://webdm.cn">股票</a></dt>
<dd><a href="javascript:void(0)">基金</a></dd>
<dd><a href="javascript:void(0)">科技</a></dd>
<dd><a href="javascript:void(0)">手机</a></dd>
<dd><a href="javascript:void(0)">数码</a></dd>
</dl>
</li>
<li>
<dl>
<dt><a href="javascript:void(0)">体育</a></dt>
<dd><a href="javascript:void(0)">NBA</a></dd>
<dd><a href="javascript:void(0)">彩票</a></dd>
<dd><a href="javascript:void(0)">娱乐</a></dd>
<dt><a href="javascript:void(0)">明星</a></dt>
<dd><a href="http://webdm.cn">音乐</a></dd>
<dd><a href="javascript:void(0)">汽车</a></dd>
<dd><a href="javascript:void(0)">购车</a></dd>
<dd><a href="javascript:void(0)">搜车</a></dd>
</dl>
</li>
<li>
<dl>
<dd><a href="javascript:void(0)">博客</a></dd>
<dd><a href="javascript:void(0)">草根</a></dd>
<dd><a href="javascript:void(0)">热文</a></dd>
<dd><a href="javascript:void(0)">视频</a></dd>
<dd><a href="javascript:void(0)">播客</a></dd>
<dd><a href="javascript:void(0)">大片</a></dd>
<dd><a href="javascript:void(0)">房产</a></dd>
<dd><a href="javascript:void(0)">家居</a></dd>
<dd><a href="javascript:void(0)">健康</a></dd>
</dl>
</li>
<li>
<dl>
<dd><a href="javascript:void(0)">读书</a></dd>
<dd><a href="javascript:void(0)">教育</a></dd>
<dd><a href="javascript:void(0)">出国</a></dd>
<dd><a href="javascript:void(0)">女性</a></dd>
<dd><a href="javascript:void(0)">星座</a></dd>
<dd><a href="javascript:void(0)">育儿</a></dd>
<dd><a href="javascript:void(0)">乐库</a></dd>
<dd><a href="javascript:void(0)">尚品</a></dd>
<dd><a href="javascript:void(0)">宠物</a></dd>
</dl>
</li>
<li>
<dl>
<dd><a href="javascript:void(0)">空间</a></dd>
<dd><a href="javascript:void(0)">邮箱</a></dd>
<dd><a href="javascript:void(0)">UC</a></dd>
<dd><a href="javascript:void(0)">论坛</a></dd>
<dd><a href="javascript:void(0)">圈子</a></dd>
<dd><a href="javascript:void(0)">相册</a></dd>
<dd><a href="javascript:void(0)">交友</a></dd>
<dd><a href="javascript:void(0)">游戏</a></dd>
<dd><a href="javascript:void(0)">UT</a></dd>
</dl>
</li>
<li>
<dl>
<dd><a href="javascript:void(0)">城市</a></dd>
<dd><a href="javascript:void(0)">广东</a></dd>
<dd><a href="javascript:void(0)">上海</a></dd>
<dd><a href="javascript:void(0)">生活</a></dd>
<dd><a href="http://webdm.cn">旅游</a></dd>
<dd><a href="javascript:void(0)">商城</a></dd>
<dd><a href="javascript:void(0)">短信</a></dd>
<dd><a href="javascript:void(0)">彩信</a></dd>
<dd><a href="javascript:void(0)">高尔夫</a></dd>
</dl>
</li>
<li>
<dl>
<dd><a href="javascript:void(0)">杂志</a></dd>
<dd><a href="javascript:void(0)">导航</a></dd>
<dd><a href="javascript:void(0)">分类</a></dd>
<dd><a href="javascript:void(0)">天气</a></dd>
<dd><a href="javascript:void(0)">爱问</a></dd>
<dd><a href="javascript:void(0)">音悦汇</a></dd>
<dd><a href="javascript:void(0)">公益</a></dd>
<dd><a href="javascript:void(0)">爱答</a></dd>
</dl>
</li>
</ul>
</div>
</body>
</html>
<br>
<p><a href="http://www.webdm.cn">网页代码站</a> - 最专业的代码下载网站 - 致力为中国站长提供有质量的代码！</p>
代码来自：http://www.webdm.cn/webcode/81f147dc-43a9-4750-8a7b-ee2a9ca42d3b.html
