代码简介：摘自当当网的36类商品分类菜单
代码内容：
<html>
<head>
<title>摘自当当网的36类商品分类菜单_网页代码站(www.webdm.cn)</title>
<style type=text/css>
BODY {
PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-SIZE: 12px; BACKGROUND: #fff; PADDING-BOTTOM: 0px; MARGIN: auto; WIDTH: 985px; COLOR: #414141; PADDING-TOP: 0px; FONT-FAMILY: "宋体", Arial,
Helvetica, sans-serif
}
.public_navi {
BACKGROUND: url(http://www.webdm.cn/images/20100915/logo_bj_line.gif) no-repeat left bottom; LINE-HEIGHT: 16px; PADDING-TOP: 10px; HEIGHT: 55px
}
.public_navi A:link {
COLOR: #0041d3; TEXT-DECORATION: none
}
.public_navi A:visited {
COLOR: #0041d3; TEXT-DECORATION: none
}
.public_navi A:hover {
COLOR: #ff7000; TEXT-DECORATION: underline
}
.public_navi A:active {
COLOR: #bc2931; TEXT-DECORATION: underline
}
.public_navi * {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px
}
.public_navi IMG {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
.public_navi .newyear_img {
FLOAT: left; WIDTH: 982px; HEIGHT: 34px
}
.public_navi .logo {
FLOAT: left; WIDTH: 148px; HEIGHT: 54px
}
.public_navi .navi_part {
FLOAT: left; WIDTH: 834px; BORDER-BOTTOM: #a1a1a1 1px solid; HEIGHT: 54px
}
.navi .navi_part .black_red {
COLOR: #e7010e
}
.public_navi .navi_part .n_main {
FLOAT: left; LIST-STYLE-TYPE: none; HEIGHT: 31px
}
.public_navi .navi_part .n_main LI {
FONT-SIZE: 14px; BACKGROUND: url(http://www.webdm.cn/images/20100915/navi_m_1.jpg) no-repeat; FLOAT: left; WIDTH: 131px; HEIGHT: 31px; TEXT-ALIGN: center
}
.public_navi .navi_part .n_main LI A {
DISPLAY: block; FONT-SIZE: 14px; WIDTH: 131px; PADDING-TOP: 10px; HEIGHT: 21px
}
.public_navi .navi_part .n_main LI A:link {
FONT-SIZE: 14px; COLOR: #fff; TEXT-DECORATION: none
}
.public_navi .navi_part .n_main LI A:visited {
COLOR: #fff; TEXT-DECORATION: none
}
.public_navi .navi_part .n_main LI A:hover {
BACKGROUND: url(http://www.webdm.cn/images/20100915/navi_m_2.jpg) no-repeat; COLOR: #fff
}
.public_navi .navi_part .n_main .m_left {
BACKGROUND: url(http://www.webdm.cn/images/20100915/navi_l_1.jpg) no-repeat
}
.public_navi .navi_part .n_main .m_left A:hover {
BACKGROUND: url(http://www.webdm.cn/images/20100915/navi_l_2.jpg) no-repeat
}
.public_navi .navi_part .n_main .m_right {
BACKGROUND: url(http://www.webdm.cn/images/20100915/navi_r_1.jpg) no-repeat
}
.public_navi .navi_part .n_main .m_right A:hover {
BACKGROUND: url(http://www.webdm.cn/images/20100915/navi_r_2.jpg) no-repeat
}
.public_navi .navi_part .n_main .navi_gray {
BACKGROUND: url(http://www.webdm.cn/images/20100915/navi_gray.jpg) no-repeat; PADDING-TOP: 10px; HEIGHT: 21px
}
.public_navi .navi_part .n_help {
PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 19px; BACKGROUND: url(http://www.webdm.cn/images/20100915/p_gwc.gif) no-repeat 0px 10px; FLOAT: right; PADDING-BOTTOM: 0px; PADDING-TOP: 10px;
LIST-STYLE-TYPE: none; HEIGHT: 15px
}
.public_navi .navi_part .n_help LI {
PADDING-RIGHT: 10px; DISPLAY: block; PADDING-LEFT: 10px; BACKGROUND: url(http://www.webdm.cn/images/20100915/bj_line.gif) no-repeat right 2px; FLOAT: left; PADDING-BOTTOM: 0px; PADDING-TOP:
2px; HEIGHT: 12px
}
.public_navi .navi_part .n_help .help_r {
PADDING-RIGHT: 0px; BACKGROUND: none transparent scroll repeat 0% 0%
}
.public_navi .navi_part .n_main2 {
BACKGROUND: url(http://www.webdm.cn/images/20100915/navi2_right_my.gif) #eaeaea no-repeat right 50%; FLOAT: left; WIDTH: 834px; LIST-STYLE-TYPE: none; HEIGHT: 23px
}
.public_navi .navi_part .n_main2 LI {
PADDING-RIGHT: 12px; DISPLAY: block; PADDING-LEFT: 12px; BACKGROUND: url(http://www.webdm.cn/images/20100915/bj_line.gif) no-repeat right 6px; FLOAT: left; PADDING-BOTTOM: 0px; PADDING-TOP:
6px; HEIGHT: 12px
}
.public_navi .navi_part .n_main2 .navi2_left {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; PADDING-BOTTOM: 0px; WIDTH: 39px; PADDING-TOP: 0px; HEIGHT: 23px
}
.public_navi .navi_part .n_main2 .navi2_right {
PADDING-RIGHT: 0px; BACKGROUND: none transparent scroll repeat 0% 0%
}
.public_navi .navi_part .n_main2 A:link {
COLOR: #414141; TEXT-DECORATION: none
}
.public_navi .navi_part .n_main2 A:visited {
COLOR: #414141; TEXT-DECORATION: none
}
.public_navi .navi_part .n_main2 A:hover {
COLOR: #ff7000; TEXT-DECORATION: underline
}
.public_navi .navi_part .n_main2 A:active {
COLOR: #bc2931; TEXT-DECORATION: underline
}
.public_top_window {
BORDER-RIGHT: #b39f86 1px solid; PADDING-RIGHT: 28px; BORDER-TOP: #b39f86 1px solid; PADDING-LEFT: 28px; PADDING-BOTTOM: 3px; BORDER-LEFT: #b39f86 1px solid; WIDTH: 608px; PADDING-TOP: 3px;
BORDER-BOTTOM: #b39f86 1px solid; HEIGHT: 154px; BACKGROUND-COLOR: #fff
}
.public_top_window A:link {
COLOR: #0041d3; TEXT-DECORATION: none
}
.public_top_window A:visited {
COLOR: #0041d3; TEXT-DECORATION: none
}
.public_top_window A:hover {
COLOR: #ff7000; TEXT-DECORATION: underline
}
.public_top_window A:active {
COLOR: #bc2931; TEXT-DECORATION: underline
}
.public_top_window * {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px
}
.public_top_window UL {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 10px; WIDTH: 608px; PADDING-TOP: 10px; BORDER-BOTTOM: #d1cfd0 1px dotted; LIST-STYLE-TYPE: none
}
.public_top_window UL LI {
DISPLAY: block; FLOAT: left; WIDTH: 66px; LINE-HEIGHT: 20px
}
.public_top_window UL H2 {
FONT-WEIGHT: normal; FONT-SIZE: 12px; FLOAT: left; WIDTH: 52px; MARGIN-RIGHT: 14px; PADDING-TOP: 3px; HEIGHT: 16px; BACKGROUND-COLOR: #f6791f; TEXT-ALIGN: center
}
.public_top_window UL H2 A:link {
COLOR: #fff; TEXT-DECORATION: none
}
.public_top_window UL H2 A:visited {
COLOR: #fff; TEXT-DECORATION: none
}
.public_top_window UL H2 A:hover {
COLOR: #fff; TEXT-DECORATION: underline
}
.public_top_window UL .h_bj {
BACKGROUND-COLOR: #00a881
}
.public_top_window UL .reduce_w {
WIDTH: 58px
}
.public_top_window UL .reduce_w2 {
WIDTH: 40px
}
.public_top_window UL .reduce1_w {
WIDTH: 28px
}
.public_top_window .reduce_h {
PADDING-BOTTOM: 5px; HEIGHT: 20px
}
.public_top_window .reduce_h3 {
PADDING-BOTTOM: 5px; HEIGHT: 35px
}
.public_top_window .reduce_h2 {
PADDING-BOTTOM: 10px; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; HEIGHT: 35px; BORDER-BOTTOM-STYLE: none
}
</style>
</head>
<body>
<SCRIPT language=javascript type=text/javascript>var pagewidth=-5;</SCRIPT>
<SCRIPT language=JavaScript1.2 type=text/javascript src="http://www.webdm.cn/images/20100915/boot.js"></SCRIPT>
<div align="center"><br>
<!--页头导航部分-->
<DIV class=public_navi>
<DIV class=logo><IMG height=40 alt=logo_当当网
src="images/dangdang.gif" width=87> </DIV>
<DIV class=navi_part>
<UL class=n_main>
<LI class=m_left><A href="" target=_self>首页</A> </LI>
<LI class=navi_gray>我的当当 </LI>
<LI class=m_right><A href="" name="two-tabs|he|all-categories">36类商品</A> </LI></UL>
</DIV>
<!--33类商品弹窗开始-->
<DIV id=all-categories style="DISPLAY: none">
<DIV class=public_top_window id=__category33list>
<UL class=reduce_h>
<LI> </LI>
<LI><A href="http://book.dangdang.com/" target=_blank>图书</A> </LI>
<LI><A href="http://music.dangdang.com/" target=_blank>音乐</A> </LI>
<LI><A href="http://movie.dangdang.com/" target=_blank>影视</A> </LI>
<LI><A href="http://static.dangdang.com/academic_av/" target=_blank>教育音像</A>
</LI>
<LI><A href="http://static.dangdang.com/game/" target=_blank>游戏</A> </LI>
<LI><A href="http://static.dangdang.com/software/" target=_blank>软件</A> </LI>
<LI class=reduce_w><A href="http://static.dangdang.com/magzine/"
target=_blank>杂志</A> </LI></UL>
<UL class=reduce_h3>
<H2><FONT color=#ffffff>百 货</FONT> </H2>
<LI><A href="http://static.dangdang.com/gm/category/92.01.shtml"
target=_blank>家居/家纺</A> </LI>
<LI><A href="http://static.dangdang.com/gm/category/92.02.shtml"
target=_blank>饰品/礼品</A> </LI>
<LI><A href="http://static.dangdang.com/gm/category/92.04.shtml"
target=_blank>箱包</A> </LI>
<LI><A href="http://static.dangdang.com/gm/category/92.07.shtml"
target=_blank>玩具</A> </LI>
<LI><A href="http://static.dangdang.com/gm/category/92.11.shtml"
target=_blank>母婴</A> </LI>
<LI><A href="http://static.dangdang.com/gm/category/92.13.shtml"
target=_blank>童鞋童装</A> </LI>
<LI><A href="http://static.dangdang.com/gm/category/92.03.shtml"
target=_blank>化妆品</A> </LI>
<LI> </LI>
<LI> </LI>
<LI><A href="http://static.dangdang.com/gm/category/92.06.shtml"
target=_blank>健康</A> </LI>
<LI><A href="http://static.dangdang.com/digital/" target=_blank>数码/IT</A>
</LI>
<LI><A href="http://static.dangdang.com/gm/category/92.12.shtml"
target=_blank>服装/鞋</A> </LI>
<LI><A href="http://static.dangdang.com/gm/category/92.14.shtml"
target=_blank>衬衫</A> </LI>
<LI><A href="http://static.dangdang.com/gm/category/92.10.shtml"
target=_blank>办公/文体</A> </LI>
<LI><A href="http://static.dangdang.com/gm/category/92.09.shtml"
target=_blank>手表</A> </LI></UL>
<UL class=reduce_h2>
<H2 class=h_bj><A href="http://mall.dangdang.com/home/default.asp">店中店</A>
</H2>
<LI><A
href="?ClassCode=16"
target=_blank>手机</A> </LI>
<LI><A
href="?ClassCode=22"
target=_blank>数码</A>/<A
href="?ClassCode=19"
target=_blank>电脑</A> </LI>
<LI><A
href="?ClassCode=10"
target=_blank>化妆品</A> </LI>
<LI><A
href="?ClassCode=21"
target=_blank>饰品</A>/<A
href="?ClassCode=8"
target=_blank>礼品</A> </LI>
<LI><A
href="?ClassCode=7"
target=_blank>玩具</A>/<A
href="?ClassCode=4"
target=_blank>母婴</A> </LI>
<LI><A
href="?ClassCode=17"
target=_blank>女装</A> </LI>
<LI class=reduce_w><A
href="?ClassCode=12"
target=_blank>箱包鞋帽</A> </LI>
<LI> </LI>
<LI> </LI>
<LI><A
href="?ClassCode=33"
target=_blank>钟表眼镜</A> </LI>
<LI><A
href="?ClassCode=3"
target=_blank>家居</A>/<A
href="?ClassCode=5"
target=_blank>家电</A> </LI>
<LI><A href="/search.cgi?ClassCode=026"
target=_blank>保健品</A> </LI>
<LI><A href="search.cgi?ClassCode=001"
target=_blank>运动</A> </LI>
<LI class=reduce_w><A
href="?ClassCode=23"
target=_blank>成人用品</A> </LI></UL>
</DIV>
</DIV>
<!--33类商品弹窗结束-->
</DIV>
</DIV>
<p><br>
<p><a href="http://www.webdm.cn">网页代码站</a> - 最专业的代码下载网站 - 致力为中国站长提供有质量的代码！</p>
</div>
</p>
<p></p>
<p><p>这是从当当网首页剥离的36类商品分类JS菜单，供大家学习参考。</p></p>
<p></p>
<p> </p>
</body>
</html>
<br>
<p><a href="http://www.webdm.cn">网页代码站</a> - 最专业的代码下载网站 - 致力为中国站长提供有质量的代码！</p>
代码来自：http://www.webdm.cn/webcode/251a929f-27ed-4d0f-9b59-b55445bcebc9.html