怎么实现不同页面导航菜单高亮显示 5
HTML代码：
<div class="r">
<ul class="nav">
<li class="nav_menu"><a href="index.html">HOME</a></li>
<li class="nav_menu"><a href="about.html">ABOUT</a></li>
<li class="nav_menu"><a href="practices.html">PRACTICES</a></li>
<li class="nav_menu"><a href="ourlawyers.html">OURLAWYERS</a></li>
<li class="nav_menu"><a href="news.html">NEWS</a></li>
<li class="nav_menu"><a href="contact.html">CONTACT</a></li>
</ul>
</div>
css代码：
.nav{
margin:28px 0 0;
padding:0;
margin:28px 0 0;
}
.nav_menu{
display:inline-block;
margin-left:25px;
position:relative;
}
.nav_menu a{
color:#b8c6ac;
font:bold 13px/24px Times,"Times New Roman", serif;
text-shadow:1px 1px #000;
}
.nav_menu a:hover ,.nav_menu:active{
color:#fff;
} 展开
<!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=utf-8" />
<title>首页</title>
<style>
.nav { margin:0; padding:0; list-style-type:none; float:left; background:#FFD1A4; margin-right:1px; color:#fff;}
.nav a { display:block; width:120px; height:45px; line-height:45px; text-align:center; color:#fff; font-size:16px; text-decoration:none;}
.curument{ margin:0; padding:0; list-style-type:none; float:left; margin-right:1px; color:#fff; background:#D96C00; font-weight:bold;}
.curument a { display:block; width:120px; height:45px; line-height:45px; text-align:center; color:#fff; font-size:16px; text-decoration:none;}
</style>
</head>
<ul id="nav">
<li id="首页" class="nav"><a href="index.html">首页</a></li>
<li id="栏目一" class="nav"><a href="1.html">栏目一</a></li>
<li id="栏目二" class="nav"><a href="2.html">栏目二</a></li>
<li id="栏目三" class="nav"><a href="3.html">栏目三</a></li>
<li id="栏目四" class="nav"><a href="4.html">栏目四</a></li>
</ul>
<script type="text/javascript">
window.onload=function(){
//alert(links_in[i]);
document.getElementById(document.title).className="curument";
};
</script>
</html>
</html>
