栏目class导航

<div id="index_nav">
　　<div class="index_nav">
　　<ul>
　　　　<!-- 调用栏目 -->
　　　　<li><a href="{DT_PATH}"><div>{$MODULE[23][name]}</div></a></li>
　　　　<li><a href="{$MODULE[24][linkurl]}"><div>{$MODULE[24][name]}</div></a></li>
　　　　<li><a href="{$MODULE[25][linkurl]}"><div>{$MODULE[25][name]}</div></a></li>
　　　　<li><a href="{$MODULE[26][linkurl]}"><div>{$MODULE[26][name]}</div></a></li>
　　　　<li><a href="{$MODULE[27][linkurl]}"><div>{$MODULE[27][name]}</div></a></li>
　　</ul>
　　<div class="clear"></div>
　　</div>
</div>

=============================
<script type="text/javascript">
$(function(){
　　 window.οnlοad=function(){
var urlSearch = window.location.href;
$('.index_nav ul').find('li').each(function(){
var id= $(this).find('a').attr('href');
if(urlSearch == id){
$(this).find('a').addClass("on");
}
});
}
});
</script>

======================

#index_nav{width: 100%;height: auto;background: #4A90E2;}
.index_nav{width: 1200px;height: auto;margin: 0 auto;}
.index_nav li{float: left;width: 200px;height: 36px; text-align: center;border-top: 4px solid #4A90E2;line-height: 36px;font-size: 18px;}
.index_nav .on div{width: 200px;height: 36px;background: #fff;color: #4A90E2;}
.index_nav a{color: #fff;}
.index_nav a:hover{color: #4A90E2;background: red;}
a{color: red;}
.index_nav li div:hover{background: #fff;}

转载于:https://www.cnblogs.com/vip-deng-vip/p/7595631.html