div+css 导航栏问题

来源:百度知道 编辑:UC知道 时间:2024/06/28 02:36:40
#mune{ width:1004px; margin-top: 0;margin-right: auto;margin-bottom: 0;margin-left: auto; background:url(../images/headbg.jpg) repeat-x top; height:39px;display:table-cell; padding:0px;}
#mune ul{ list-style-type:none; margin:0px;padding:0px; padding-left:10px;}
#mune li{ float:left; width:95px; color:#005CB4; text-align:center;height:39px; line-height:39px; font-family:"宋体"; font-weight:bold; font-size:12px; background:url(../images/linebg.jpg) right top no-repeat;}
#mune ul li a{ display:block;color:#005CB4; text-decoration:none; line-height:39px; text-align:center; font-family:"宋体"; font-weight:bold; font-size:12px;}
#mune ul li a:hover{ display:block;color:#ffffff; text-decoration:none; line-height:39px; text-align:center;font-family:"宋体"; font-weight:bold; font-size:12px; background:url(../images/movebg.jpg) center; width:75px;}

<div id="mune">
<ul>
<li><a href="inde

如果你是要在一个页面上实现这个效果的话;那么是需要js来实现,css实现不了;
#mune ul li a.dianBy{background:url(../images/movebg.jpg) center}加上这个css;
这个js加在<div id="mune"></div>后面
<script type="text/javascript">
var aId = document.getElementById("mune").getElementsByTagName("a");
for(var i=0; i<aId.length;i++){
aId[i].onclick = function(){
for(var j=0; j<aId.length;j++){
aId[j].className = "";
}
this.className = "dianBy";
}
}
</script>
///////////////////////////////
但是看你上面的代码又好象都是新页面打开,那么直接在新页面给要背景的a另写个背景样式不就可以了........;

css可以实现

不过需要给一些元素添加id

下面只写个样子:
<div id="mune">
<ul>
<li id="首页"><a href="index.php">网站首页</a></li>
<li id="概况"><a href="about.php">社区概况</a></li>
</u