以下是 jquery仿易迅商城分类菜单代码 的示例演示效果:
部分效果截图:
HTML代码(index.html):
<!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>jQuery.SuperSlide��Ѹ����ർ���˵������</title>
<link href="css/zzsc.css" rel="stylesheet" type="text/css">
<script src="js/jquery1.42.min.js" type="text/javascript"></script>
<script src="js/jquery.SuperSlide.2.1.1.js" type="text/javascript"></script>
</head>
<body>
<!-- ���� ��ʼ -->
<div class="warpper">
<div class="menu">
<ul>
<li><a href="#">�ҵ��</a><span class="hot"></span></li>
<li><a href="#">��ں�</a></li>
<li><a href="#">�Ź�</a></li>
<li><a href="#">����</a></li>
<li><a href="#">��������</a></li>
<li><a href="#">����Ա���ʦ�����Ա���</a><span class="hot"></span></li>
</ul>
</div>
<div id="nav">
<div class="mod_cate_hd">ȫ����Ʒ����</div>
<ul class="tit">
<li class="mod_cate">
<h2><i class="arrow_dot fr"></i><a href="#">�ֻ�</a><a href="#">����</a><a class="hot_sub" href="#">��Լ��</a></h2>
<p class="mod_cate_r"><a href="#">����</a><a href="#">����</a><a href="#">�������</a><a href="#">�����豸</a></p>
<div class="mod_subcate">
<div class="mod_subcate_main">
<dl>
<dt>�ֻ�ͨѶ</dt>
<dd>
<a href="#">ȫ���ֻ�</a><a href="#">�Խ���</a>
<i class="mod_subcate_line"></i>
<a href="#">����</a><a href="#">ƻ��</a><a href="#">��Ϊ</a><a href="#">С��</a><a href="#">ŵ����</a><a href="#">����</a><a href="#">HTC</a><a href="#">����</a><a href="#">����</a><a href="#">����</a><a href="#">����</a><a href="#">�й��ƶ�</a>
</dd>
</dl>
<dl>
<dt>��Ӫ��</dt>
<dd>
<a href="#">�����ͷ�</a><a href="#" class="org">0Ԫ����</a><a href="#">3G������</a><a href="#">ѡ������</a><a href="#">��ֵ</a>
</dd>
</dl>
<dl>
<dt>�ֻ����</dt>
<dd>
<a href="#" class="org">�ƶ���Դ</a><a href="#" class="org">��������</a><a href="#">�ֻ���/���</a><a href="#">��Ĥ</a><a href="#">���</a><a href="#">�����</a><a href="#">������</a><a href="#">�ֻ�����/����</a><a href="#">����</a><a href="#">�������</a><a href="#">�������</a><a href="#">iPhone���</a><a href="#">TF��</a><a href="#">��������</a>
</dd>
</dl>
<dl>
<dt>��������</dt>
<dd>
<a href="#">�������</a><a href="#" class="org">��/�����</a><a href="#">�����</a><a href="#">������</a>
</dd>
</dl>
<dl>
<dt>����/��ͷ</dt>
<dd>
<a href="#">ȫ��</a><a href="#">����</a><a href="#">�</a><a href="#">����</a><a href="#">����></a>
<i class="mod_subcate_line"></i>
<a href="#">������ͷ</a><a href="#">����ͷ</a>
</dd>
</dl>
<dl>
<dt>��������</dt>
<dd>
<a href="#">�������</a><a href="#" class="org">��/�����</a><a href="#">�����</a><a href="#">������</a>
</dd>
</dl>
<dl>
<dt>�������</dt>
<dd>
<a href="#" class="org">�洢��</a><a href="#" class="org">U��</a><a href="#">�����</a><a href="#">������</a><a href="#">��Ĥ</a><a href="#">�˾�</a><a href="#">���ż�</a><a href="#">�����</a><a href="#">�ڹ���</a><a href="#">רҵ���</a><a href="#">�����Ʒ</a><a href="#">��Զ��</a><a href="#">�ƶ�Ӳ��</a><a href="#" class="org">�ƶ���Դ</a><a href="#">������</a><a href="#">�ɵ��</a><a href="#">�����</a>
</dd>
</dl>
<dl>
<dt>ƻ��ר��</dt>
<dd>
<a href="#">iphone</a><a href="#">ipad</a><a href="#">Mac</a><a href="#">ipod</a><a href="#">iphone���</a><a href="#">ipad���</a><a href="#">���������</a><a href="#">ƻ���������</a><a href="#">ipod���</a>
</dd>
</dl>
<dl>
<dt>����Ӱ��</dt>
<dd>
<a href="#" class="org">���ܴ���</a><a href="#">MP3��MP4</a><a href="#">�忨����</a><a href="#">��������</a><a href="#">�������</a><a href="#">����/��¼��</a><a href="#">���岥����</a><a href="#">����</a>
</dd>
</dl>
<dl>
<dt>���ӽ���</dt>
<dd>
<a href="#">��ֽ��</a><a href="#">¼���</a><a href="#">���Ӵʵ�</a><a href="#">����ѧϰ/���</a><a href="#">������</a>
</dd>
</dl>
<div class="mod_subcate_channel"><a class="mod_btn_arrow" href="#"><b>�ֻ�/���Ƶ��</b><i class="arrow_dot"></i></a><a class="mod_btn_arrow" href="#"><b>��������롢ƻ��Ƶ��</b><i class="arrow_dot"></i></a></div>
</div>
<div class="mod_subcate_side">
<div class="mod_subcate_side_hd">����Ʒ��</div>
<ul class="mod_subcate_side_brand clearfix">
<li><a href="#"><img src="images/1.jpg" /></a></li>
<li><a href="#"><img src="images/2.jpg" /></a></li>
<li><a href="#"><img src="images/3.jpg" /></a></li>
<li><a href="#"><img src="images/4.jpg" /></a></li>
<li><a href="#"><img src="images/5.jpg" /></a></li>
<li><a href="#"><img src="images/6.jpg" /></a></li>
<li><a href="#"><img src="images/7.jpg" /></a></li>
<li><a href="#"><img src="images/8.jpg" /></a></li>
</ul>
<div class="mod_subcate_side_hd">���Ż</div>
<ul class="mod_subcate_side_hotlist">
<li><a href="#">��Ϊ3X������</a></li>
<li><a href="#">����ֻ����´� ֱ��400��</a></li>
</ul>
<a class="mod_subcate_gg" href="#"><img src="images/0.jpg" /></a>
</div>
</div>
</li>
<li class="mod_cate">
<h2><i class="arrow_dot fr"></i><a href="#">����</a><a href="#">Ӳ������</a><a class="hot_sub" href="#">װ����</a></h2>
<p class="mod_cate_r"><a href="#">���</a><a href="#">�ƶ�Ӳ��</a><a href="#">����</a><a href="#">ƽ��</a></p>
<div class="mod_subcate">
<div class="mod_subcate_main">
<dl>
<dt>�����Ƽ�</dt>
<dd>
<a href="#">ipad air</a><a href="#">mini</a><a href="#">Surface</a><a href="3">�ƶ�Ӳ��1TB</a><a href="#">������</a><a href="#">��Ϸ���</a>
</dd>
</dl>
<div class="mod_subcate_channel"><a class="mod_btn_arrow" href="#"><b>��������Ƶ��</b><i class="arrow_dot"></i></a><a class="mod_btn_arrow" href="#"><b>Ӳ��/����Ƶ��</b><i class="arrow_dot"></i></a><a class="mod_btn_arrow" href="#"><b>���Ը���Ƶ��</b><i class="arrow_dot"></i></a><a class="mod_btn_arrow" href="#"><b>��Ƶ��</b><i class="arrow_dot"></i></a><a class="mod_btn_arrow" href="#"><b>��Ѷ�ܱ�</b><i class="arrow_dot"></i></a></div>
</div>
<div class="mod_subcate_side">
<div class="mod_subcate_side_hd">����Ʒ��</div>
<ul class="mod_subcate_side_brand clearfix">
<li><a href="#"><img src="images/9.jpg" /></a></li>
<li><a href="#"><img src="images/10.jpg" /></a></li>
<li><a href="#"><img src="images/11.jpg" /></a></li>
<li><a href="#"><img src="images/12.jpg" /></a></li>
<li><a href="#"><img src="images/13.jpg" /></a></li>
<li><a href="#"><img src="images/14.jpg" /></a></li>
<li><a href="#"><img src="images/15.jpg" /></a></li>
<li><a href="#"><img src="images/16.jpg" /></a></li>
<li><a href="#"><img src="images/17.jpg" /></a></li>
<li><a href="#"><img src="images/18.jpg" /></a></li>
<li><a href="#"><img src="images/19.jpg" /></a></li>
</ul>
<div class="mod_subcate_side_hd">���Ż</div>
<ul class="mod_subcate_side_hotlist">
<li><a href="#">�����´���� ȫ�����ֱ��500��</a></li>
</ul>
<a class="mod_subcate_gg" href="#"><img src="images/00.jpg" /></a>
</div>
</div>
</li>
<li class="mod_cate">
<h2><i class="arrow_dot fr"></i><a href="#">��ҵ�</a></h2>
<p class="mod_cate_r"><a href="#">����</a><a href="#">�յ�</a><a href="#">����</a><a href="#">ϴ�»�</a></p>
<div class="mod_subcate">
<div class="mod_subcate_main">
<dl>
<dt>����</dt>
<dd>
<a href="#">ȫ��</a><a href="#">��ά</a><a class="org" href="#">����</a><a href="3">TCL</a><a href="#">����</a><a href="#">����</a><a class="org" href="#">����</a><a href="#">����</a><a class="org" href="#">����</a><a href="#">�ֻ�</a><a href="#">LG</a><a href="#">����</a><a href="#">��è</a><a href="#">����</a><a href="#">��֥</a><a class="org" href="#">����</a><a href="#">����></a>
<i class="mod_subcate_line"></i>
<a href="#">32Ӣ��</a><a href="#">39-40Ӣ��</a><a href="#">42-43Ӣ��</a><a class="org" href="#">46-48Ӣ��</a><a href="#">50-55Ӣ��</a><a href="#">60Ӣ������</a><a href="#">32Ӣ������</a>
</dd>
</dl>
<div class="mod_subcate_channel"><a class="mod_btn_arrow" href="#"><b>�ʵ�Ӱ��/�յ���ϴƵ��</b><i class="arrow_dot"></i></a></div>
</div>
<div class="mod_subcate_side">
<div class="mod_subcate_side_hd">����Ʒ��</div>
<ul class="mod_subcate_side_brand clearfix">
<li><a href="#"><img src="images/20.jpg" /></a></li>
<li><a href="#"><img src="images/21.jpg" /></a></li>
<li><a href="#"><img src="images/22.jpg" /></a></li>
<li><a href="#"><img src="images/23.jpg" /></a></li>
<li><a href="#"><img src="images/24.jpg" /></a></li>
<li><a href="#"><img src="images/25.jpg" /></a></li>
</ul>
<div class="mod_subcate_side_hd">���Ż</div>
<ul class="mod_subcate_side_hotlist">
<li><a href="#">����ͷ����TCL������ǰ��</a></li>
<li><a href="#">���Ųʵ����ۻ�</a></li>
<li><a href="#">�������ܵ��ӻ������һ�</a></li>
<li><a href="#">����ϲӭ�´���������</a></li>
</ul>
<a class="mod_subcate_gg" href="#"><img src="images/000.jpg" /></a>
</div>
</div>
</li>
<li class="mod_cate">
<h2><i class="arrow_dot fr"></i><a href="#">��������</a><a href="#">�������</a></h2>
<p class="mod_cate_r"><a href="#">���뵶</a><a href="#">��¯</a><a href="#">ȡů�豸</a></p>
<div class="mod_subcate">
<div class="mod_subcate_main">
<dl>
<dt>������</dt>
<dd>
<a class="org" href="#">����������</a><a class="org" href="#">ȡů�豸</a><a class="org" href="#">������͡</a><a href="#">����¯</a><a href="#">ů���</a><a href="#">С̫��</a>
</dd>
</dl>
<div class="mod_subcate_channel"><a class="mod_btn_arrow" href="#"><b>��������Ƶ��</b><i class="arrow_dot"></i></a><a class="mod_btn_arrow" href="#"><b>�������Ƶ��</b><i class="arrow_dot"></i></a></div>
</div>
<div class="mod_subcate_side">
<div class="mod_subcate_side_hd">����Ʒ��</div>
<ul class="mod_subcate_side_brand clearfix">
<li><a href="#"><img src="images/1.jpg" /></a></li>
<li><a href="#"><img src="images/2.jpg" /></a></li>
<li><a href="#"><img src="images/3.jpg" /></a></li>
<li><a href="#"><img src="images/4.jpg" /></a></li>
<li><a href="#"><img src="images/5.jpg" /></a></li>
<li><a href="#"><img src="images/6.jpg" /></a></li>
<li><a href="#"><img src="images/7.jpg" /></a></li>
<li><a href="#"><img src="images/8.jpg" /></a></li>
</ul>
<div class="mod_subcate_side_hd">���Ż</div>
<ul class="mod_subcate_side_hotlist">
<li><a href="#">��Ϊ3X������</a></li>
<li><a href="#">����ֻ����´� ֱ��400��</a></li>
</ul>
<a class="mod_subcate_gg" href="#"><img src="images/0.jpg" /></a>
</div>
</div>
</li>
<li class="mod_cate">
<h2><i class="arrow_dot fr"></i><a href="#">ʳƷ/����/����</a><a class="hot_sub" href="#">����</a></h2>
<p class="mod_cate_r"><a href="#">����</a><a href="#">������</a><a href="#">��</a><a href="#">����</a><a href="#">��բз</a></p>
<div class="mod_subcate">
<div class="mod_subcate_main">
<dl>
<dt>����ʳƷ����</dt>
<dd>
<a href="#">ȫ��</a><a href="#">���ϳ��</a>
</dd>
</dl>
<dl>
<dt>������ʳ</dt>
<dd>
<a href="#">ȫ��</a><a href="#">��ͳ���</a><a href="#">��ʽ���</a>
</dd>
</dl>
</div>
<div class="mod_subcate_side">
<div class="mod_subcate_side_hd">����Ʒ��</div>
<ul class="mod_subcate_side_brand clearfix">
<li><a href="#"><img src="images/1.jpg" /></a></li>
<li><a href="#"><img src="images/2.jpg" /></a></li>
<li><a href="#"><img src="images/3.jpg" /></a></li>
<li><a href="#"><img src="images/4.jpg" /></a></li>
<li><a href="#"><img src="images/5.jpg" /></a></li>
<li><a href="#"><img src="images/6.jpg" /></a></li>
<li><a href="#"><img src="images/7.jpg" /></a></li>
<li><a href="#"><img src="images/8.jpg" /></a></li>
</ul>
<div class="mod_subcate_side_hd">���Ż</div>
<ul class="mod_subcate_side_hotlist">
<li><a href="#">��Ϊ3X������</a></li>
<li><a href="#">����ֻ����´� ֱ��400��</a></li>
</ul>
<a class="mod_subcate_gg" href="#"><img src="images/0.jpg" /></a>
</div>
</div>
</li>
<li class="mod_cate">
<h2><i class="arrow_dot fr"></i><a href="#">��װ</a><a href="#">�ֱ�</a><a href="#">�ҷ�</a><a href="#">����</a></h2>
<p class="mod_cate_r"><a href="#">����</a><a href="#">NIKE</a><a href="#">��Ʒ</a><a href="#">���</a><a href="#">�ƽ�</a></p>
<div class="mod_subcate">
<div class="mod_subcate_main">
<dl>
<dt>�����Ƽ�</dt>
<dd>
<a href="#">�ֱ�</a><a href="#">����</a>
</dd>
</dl>
<div class="mod_subcate_channel"><a class="mod_btn_arrow" href="#"><b>�Ҿ�����Ƶ��</b><i class="arrow_dot"></i></a></div>
</div>
<div class="mod_subcate_side">
<div class="mod_subcate_side_hd">����Ʒ��</div>
<ul class="mod_subcate_side_brand clearfix">
<li><a href="#"><img src="images/1.jpg" /></a></li>
<li><a href="#"><img src="images/2.jpg" /></a></li>
<li><a href="#"><img src="images/3.jpg" /></a></li>
<li><a href="#"><img src="images/4.jpg" /></a></li>
<li><a href="#"><img src="images/5.jpg" /></a></li>
<li><a href="#"><img src="images/6.jpg" /></a></li>
<li><a href="#"><img src="images/7.jpg" /></a></li>
<li><a href="#"><img src="images/8.jpg" /></a></li>
</ul>
<div class="mod_subcate_side_hd">���Ż</div>
<ul class="mod_subcate_side_hotlist">
<li><a href="#">��Ϊ3X������</a></li>
<li><a href="#">����ֻ����´� ֱ��400��</a></li>
</ul>
<a class="mod_subcate_gg" href="#"><img src="images/0.jpg" /></a>
</div>
</div>
</li>
<li class="mod_cate">
<h2><i class="arrow_dot fr"></i><a href="#">��������</a><a class="hot_sub" href="#">������</a></h2>
<p class="mod_cate_r"><a href="#">GPS����</a><a href="#">����</a><a href="#">��װ���</a></p>
<div class="mod_subcate">
<div class="mod_subcate_main">
<dl>
<dt>��������</dt>
<dd>
<a class="org" href="#">GPS/ר��DVD����</a><a href="#">MP3 MP4</a>
</dd>
</dl>
<div class="mod_subcate_channel"><a class="mod_btn_arrow" href="#"><b>������������װ��Ƶ��</b><i class="arrow_dot"></i></a></div>
</div>
<div class="mod_subcate_side">
<div class="mod_subcate_side_hd">����Ʒ��</div>
<ul class="mod_subcate_side_brand clearfix">
<li><a href="#"><img src="images/1.jpg" /></a></li>
<li><a href="#"><img src="images/2.jpg" /></a></li>
<li><a href="#"><img src="images/3.jpg" /></a></li>
<li><a href="#"><img src="images/4.jpg" /></a></li>
<li><a href="#"><img src="images/5.jpg" /></a></li>
<li><a href="#"><img src="images/6.jpg" /></a></li>
<li><a href="#"><img src="images/7.jpg" /></a></li>
<li><a href="#"><img src="images/8.jpg" /></a></li>
</ul>
<div class="mod_subcate_side_hd">���Ż</div>
<ul class="mod_subcate_side_hotlist">
<li><a href="#">��Ϊ3X������</a></li>
<li><a href="#">����ֻ����´� ֱ��400��</a></li>
</ul>
<a class="mod_subcate_gg" href="#"><img src="images/0.jpg" /></a>
</div>
</div>
</li>
<li class="mod_cate">
<h2><i class="arrow_dot fr"></i><a href="#">�ľ�/�칫��Ʒ</a><a class="hot_sub" href="#">�����Ʒ</a></h2>
<p class="mod_cate_r"><a href="#">��ӡ�豸</a><a href="#">�IJ�</a><a href="#">�칫�ľ�</a></p>
<div class="mod_subcate">
<div class="mod_subcate_main">
<dl>
<dt>��ӡ�豸</dt>
<dd>
<a class="org" href="#">�����ӡ��</a><a href="#">��ī��ӡ��</a><a href="#">��ʽ��ӡ��</a>
</dd>
</dl>
<div class="mod_subcate_channel"><a class="mod_btn_arrow" href="#"><b>�ľ��ܱ�/�칫��ƷƵ��</b><i class="arrow_dot"></i></a></div>
</div>
<div class="mod_subcate_side">
<div class="mod_subcate_side_hd">����Ʒ��</div>
<ul class="mod_subcate_side_brand clearfix">
<li><a href="#"><img src="images/1.jpg" /></a></li>
<li><a href="#"><img src="images/2.jpg" /></a></li>
<li><a href="#"><img src="images/3.jpg" /></a></li>
<li><a href="#"><img src="images/4.jpg" /></a></li>
<li><a href="#"><img src="images/5.jpg" /></a></li>
<li><a href="#"><img src="images/6.jpg" /></a></li>
<li><a href="#"><img src="images/7.jpg" /></a></li>
<li><a href="#"><img src="images/8.jpg" /></a></li>
</ul>
<div class="mod_subcate_side_hd">���Ż</div>
<ul class="mod_subcate_side_hotlist">
<li><a href="#">��Ϊ3X������</a></li>
<li><a href="#">����ֻ����´� ֱ��400��</a></li>
</ul>
<a class="mod_subcate_gg" href="#"><img src="images/0.jpg" /></a>
</div>
</div>
</li>
</ul>
<div class="mod_cate2">
<h2><a href="#">QQ����</a><a class="yel" href="#">��Ʊ</a><a href="#">��ֵ</a></h2>
<p class="mod_cate_r"><a href="#">��ױ</a><a href="#">����</a><a href="#">Ʊ��</a><a class="yel" href="#">����Ա���ʦ�����Ա���</a></p>
</div>
</div>
</div>
<script type="text/javascript">
$("#nav .tit").slide({
type:"menu",
titCell:".mod_cate",
targetCell:".mod_subcate",
delayTime:0,
triggerTime:10,
defaultPlay:false,
returnDefault:true
});
</script>
<!-- ���� ���� -->
</body>
</html>
CSS代码(zzsc.css):
body,div,ul,li,dl,dt,dd,h2,p{padding:0;margin:0;}
body{font-family:"Lucida Grande",tahoma,arial,����;}
ul{list-style:none;}
img{border:none;}
a{blr:expression(this.onFocus=this.blur());outline:none;text-decoration:none;}
a:hover{text-decoration:underline;}
.clearfix:after{content:" ";clear:both;height:0;visibility:hidden;display:block;}
.clearfix{*zoom:1;}
.fr{float:right;}
/*����css*/
.warpper{width:1190px;margin:15px auto 0 auto;}
.menu{padding-left:193px;}
.menu,.menu ul li,.menu ul li a{height:39px;line-height:39px;background:#1369C0}
.menu ul li,.menu ul li a{float:left;position:relative;}
.menu ul li span.hot{display:block;width:29px;height:17px;background:url(../images/hot.png) no-repeat;position:absolute;left:50px;top:-10px;}
.menu ul li a{display:block;padding:0 28px 0 28px;color:#FFFFFF;font-size:14px;font-family:"Microsoft Yahei";}
.menu ul li a:hover{background:#135DBC;text-decoration:none;}
#nav{width:190px;position:relative;top:-41px;background:#4593FD;z-index:1;box-shadow:4px 2px 5px rgba(0,0,0,0.3);}
#nav .mod_cate_hd{height:40px;line-height:40px;font-size:16px;color:#FFFFFF;text-indent:7px;box-shadow:2px -1px 3px rgba(55,55,55,0.5);background-color:#4593FD;border-bottom:1px #3487F2 solid;font-family:"Microsoft Yahei";}
#nav .mod_cate,#nav .mod_cate2{height:41px;border-top:1px #5AA1FE solid;border-bottom:1px #3487F2 solid;padding:9px 10px 10px 10px;}
#nav .mod_cate h2,#nav .mod_cate2 h2{font-size:14px;font-weight:normal;font-family:"Microsoft Yahei";}
#nav .mod_cate h2 a,#nav .mod_cate2 h2 a{color:#FFFFFF;padding-right:5px;}
#nav .mod_cate a.hot_sub{background:#106AC0;font-size:12px;border-radius:9px;padding:0px 5px;margin-left:5px;}
#nav .mod_cate_r{line-height:24px;font-style:normal;font-variant:normal;}
#nav .mod_cate_r a{font-size:12px;color:#C2D9F8;padding-right:5px;}
#nav .mod_cate2{background:none;}
#nav .mod_cate2 a.yel{color:#fee602;}
#nav .mod_subcate{display:none;width:798px;height:580px;border:2px #4594fd solid;background:#FFFFFF;box-shadow:5px 5px 10px rgba(0,0,0,0.4);position:absolute;top:41px;z-index:-1;left:188px;overflow:hidden;}
#nav .mod_subcate_main{width:530px;padding:0px 20px 1000px 20px;margin-bottom:-1000px;border-right:1px #ddd solid;float:left;}
#nav .mod_subcate_line{width:100%;height:1px;clear:both;font-size:0px;margin-bottom:5px;border-top:5px #fff solid;border-bottom:1px #dadada dotted;overflow:hidden;display:block;}
#nav .mod_subcate_main dl{padding:7px 0 7px 65px;border-bottom:1px #e5e5e5 solid;overflow:hidden;}
#nav .mod_subcate_main dl dt{width:65px;font-size:12px;color:#1d7ad9;line-height:22px;font-style:normal;font-variant:normal;font-weight:700;margin-left:-65px;float:left;font-size-adjust:none;font-stretch:normal}
#nav .mod_subcate_main dl dd{line-height:22px;overflow:hidden;}
#nav .mod_subcate_main dl dd a{color:#666;font-size:12px;margin:0 5px 0 5px;float:left;display:inline;white-space:nowrap;}
#nav .mod_subcate_main dl dd a.org{color:#ff7300;}
#nav .mod_subcate_channel{clear:both;margin-top:15px;}
#nav .mod_subcate_channel .mod_btn_arrow{height:26px;line-height:26px;font-size:12px;padding:0 10px 0 10px;margin-left:5px;text-decoration:none;color:#FFFFFF;background:#2785E6;cursor:pointer;display:inline-block;}
#nav .mod_subcate_channel .mod_btn_arrow b{font-weight:normal;float:left;}
#nav .arrow_dot{width:0px;height:0px;overflow:hidden;font-size:0px;margin:9px 0 0 5px;border:4px transparent dashed;border-left:4px #FFFFFF solid;}
#nav .mod_subcate_side{width:217px;padding-top:5px;padding-left:10px;padding-bottom:1000px;margin-bottom:-1000px;float:left;}
#nav .on{padding:8px 10px 9px 8px;border-top:2px #5AA1FE solid;border-bottom:2px #3487F2 solid;margin-left:2px;background:#FFFFFF;}
#nav .on h2 a{color:#333333;}
#nav .on .mod_subcate{display:block !important;/* !important ǿ����ʾ���������˸*/
}
#nav .on .mod_cate_r a{color:#666666;}
#nav .on a.hot_sub{color:#FFFFFF;}
/*Ʒ��*/
.mod_subcate_side_hd{height:30px;line-height:30px;padding-left:4px;color:#333333;font-size:14px;font-family:"���ź�",Arial;}
.mod_subcate_side_brand{margin:5px 0 10px 4px;}
.mod_subcate_side_brand li{border:1px #EEEEEE solid;margin:-1px 0 0 -1px;position:relative;float:left;}
/*���Ż*/
.mod_subcate_side_hotlist{margin-left:4px;}
.mod_subcate_side_hotlist li{height:20px;font-size:12px;color:#666666;overflow:hidden;}
.mod_subcate_side_hotlist li a{color:#666666;}
/*ad*/
.mod_subcate_gg{display:block;position:absolute;bottom:0;right:0;}
分享到QQ
分享到微博
微信扫一扫
