Question

css导航菜单点击后如何改变背景图片？

很多css导航是鼠标移开或点击后回归原色，现在是如何实现点击后，鼠标离开后的底色就是鼠标移到菜单上的底色，并且点击另一个菜单的时候 前一个菜单的底色回归原色。就像凡客和蓝色理想。
但是我不需要二级菜单 就一级的导航。
注意的是：点击超链接之后，页面要跳转到一个新页面。比如：a.html b.html c.html这三个页面。在a.html页面点击导航菜单的b.html链接页面之后，导航菜单上的b.html菜单链接的背景色或是背景图片变换了。而导航菜单的a.html菜单链接中的背景色或是背景图片又回归到了原背景色或原背景图。

Answer 1

CSS中，可以用伪类来改变背景图片，一般有几种状态：

a:link 未访问时候的状态

a:hover 鼠标放上去时候的状态

a:visited  已访问的状态

a:active  鼠标按下去时候的状态

你只要根据这几点来写就可以，你要点击后改变背景，可以这样写：

a:link{background:url(原来的图片) no-repeat;}
a:visited{background:url(点击过的图片) no-repeat;}

 

 

CSS（层叠样式表）级联样式表是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。

Answer 2

为导航按钮写两个CSS样式，然后分别针对链接的四个状态来写链接的CSS样式
比如：
.mainNavLine{width:10px;height:33px;overflow:hidden;background-image:url(../Images/sprite_10px.jpg);background-position:0 -66px;}
.mainNoSelLi a:link,.mainNoSelLi a:visited{color:#000;}
.mainNoSelLi a:hover,.mainNoSelLi a:active,.mainSelLi a:link,.mainSelLi a:visited,.mainSelLi a:hover,.mainSelLi a:active{color:#000;background:url(../Images/ico_selLink.jpg) center center no-repeat;text-decoration:none;}

Answer 3

那种导航用flash做 效果会很好的

Answer 4

纯用css写很麻烦, 建议css+js