日期:2014-05-17  浏览次数:20694 次

css 如何让横向导航菜单里选中的菜单项高亮?
是要用js控制吗?用css行不行。

#tabsJ   {
float:   left;
width:   100%;
background:   #F0F0F0;
font-size:   100%;
line-height:   normal;
border-bottom:   1px   solid   #24618E;
}

#tabsJ   ul   {
margin:   0;
padding:   10px   10px   0   50px;
list-style:   none;
}

#tabsJ   li   {
display:   inline;
margin:   0;
padding:   0;
}

#tabsJ   a   {
float:   left;
background:   url( "tableftJ.gif ")   no-repeat   left   top;
margin:   0;
padding:   0   0   0   5px;
text-decoration:   none;
}

#tabsJ   a   span   {
float:   left;
display:   block;
background:   url( "tabrightJ.gif ")   no-repeat   right   top;
padding:   5px   15px   4px   6px;
color:   #24618E;
}

/*   Commented   Backslash   Hack   hides   rule   from   IE5-Mac   \*/
#tabsJ   a   span   {
float:   none;
}

/*   End   IE5-Mac   hack   */
#tabsJ   a:hover   span   {
color:   #FFF;
}

#tabsJ   a:hover   {
background-position:   0%   -42px;
}

#tabsJ   a:hover   span   {
background-position:   100%   -42px;
}



------解决方案--------------------
http://www.forest53.com/tutorials/tutorials_show.asp?sortid=1&id=35
------解决方案--------------------
#tabsJ #current {
background-position: 0% -42px;
}

.............
.........
<li id= "current "> <a

选中的菜单项设置其id为current