Div+CSS+JS树型菜单，可刷新

日期：2008年5月26日作者：查看:[大字体中字体小字体]

<!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>Div+Css+JS树型菜单，可刷新</title>
<meta name="description" content="http://www.webjx.com">
<style type="text/css">
<!--
*{margin:0;padding:0;border:0;}
body {
font-family: arial, 宋体, serif;
font-size:12px;
}
#nav {
width:180px;
line-height: 24px;
list-style-type: none;
text-align:left;
/*定义整个ul菜单的行高和背景色*/
}

/*==================一级目录===================*/
#nav a {
width: 160px;
display: block;
padding-left:20px;
/*Width(一定要)，否则下面的Li会变形*/
}

#nav li {
background:#CCC; /*一级目录的背景色*/
border-bottom:#FFF 1px solid; /*下面的一条白边*/
float:left;
/*float：left,本不应该设置，但由于在Firefox不能正常显示
继承Nav的width,限制宽度，li自动向下延伸*/
}

#nav li a:hover{
background:#CC0000; /*一级目录onMouseOver显示的背景色*/
}

#nav a:link {
color:#666; text-decoration:none;
}
#nav a:visited {
color:#666;text-decoration:none;
}
#nav a:hover {
color:#FFF;text-decoration:none;font-weight:bold;
}

/*==================二级目录===================*/
#nav li ul {
list-style:none;
text-align:left;
}
#nav li ul li{
background: #EBEBEB; /*二级目录的背景色*/
}

#nav li ul a{
padding-left:20px;
width:160px;
/* padding-left二级目录中文字向右移动，但Width必须重新设置=(总宽度-padding-left)*/
}

/*下面是二级目录的链接样式*/

#nav li ul a:link {
color:#666; text-decoration:none;
}
#nav li ul a:visited {
color:#666;text-decoration:none;
}
#nav li ul a:hover {
[1] [2] [3] [4] [5] 下一页
Div+CSS+JS树型菜单，可刷新相关文章：
·春节新年新春对联大全
·新年祝福语过年祝福语
·侠盗猎车3最新秘籍
·最新幽默短信：经典幽默短信
·经典短信:2007最新短信
·网络黑客新手入门必备知识
·新春短信:新春祝福语祝福短信
·最全最新的mp3芯片介绍
·2007整人短信：2007最新整人短信
·最新版FreeTextBox(版本3.1.6)在ASP.Net 2.0中使用简解
Div+CSS+JS树型菜单，可刷新相关软件
·新仙剑奇侠传电视剧纪念XP版
·《冰封王座》国内流行新版3C地图包
·《劲乐团》最新客户端
·新抢滩登陆太平洋战役
·腾讯QQ2007 新珊瑚虫正式版
·疯狂机器3之新实验
·新版坦克大战2005
·《华夏Ⅱ》最新客户端
·《跑跑卡丁车》最新客户端
·最新3D撕裂重罪

上一篇:CSS入门：关于css样式表

下一篇:基础——关于CSS样式表

特别声明：本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载，但请务必注明出处和原始作
者.文章版权归文章原始作者所有.对于被本站转载文章的个人和网站，我们表示深深的谢意。如果本站转
载的文章有版权问题请联系编辑人员,我们尽快予以更正. 转载请注明来源：http://www.hackhome.com

Div+CSS+JS树型菜单，可刷新

精品推荐

热点TOP10

特别推荐