请教各位一个在css中切换图片的问题，附简单测试代码。
我想实现当鼠标滑动到一个div上，背景图片发生改变。代码如下：
html页面
[code]<head>
<link href="CSSwppMenu.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class = "TitleHeader" >china</div>
<div class = "TitleHeaderWithoutSubTitle">usa<div>
</body>[/code]
css page:
[code].TitleHeader
{
background-image:url('bg02.jpg');
}
.TitleHeaderWithoutSubTitle
{
background-image:url('bg01.jpg');
}
.TitleHeader a:hover
{
background-image:url('bg01.jpg');
}
.TitleHeaderWithoutSubTitle a:hover
{
backgroud-image:url('bg03.gif');
}[/code]
以上是我写的，但是有错误，请教各位朋友了！ 你的html中连a标签都没有，定义a:hover有什么作用呢？
比如：
[html]
<!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 content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Untitled 1</title>
<style type="text/css">
.test{
padding:1px;border:1px silver solid;float:left;
}
.test a{
display:block;width:435px;height:290px;
}
.test a:link,.test a:visited{
background:white url(http://img1.cache.netease.com/cnews/2008/8/28/2008082809312312a00.jpg) no-repeat;
}
.test a:hover,.test a:active{
background:gray url(http://img2.cache.netease.com/cnews/2008/8/27/20080827113250aa0a2.jpg) no-repeat;
}
.test a span{
display:none;
}
</style>
</head>
<body>
<div class="test">
<a href="http://www.iwcn.net" title="Link To Daviv's Blog"><span>blog</span></a>
</div>
</body>
</html>
[/html]
[[i] 本帖最后由 jxdawei 于 2008-8-28 22:50 编辑 [/i]] 很好. 如果你再加点JAVASCRIPT就更简单了.不过光这个CSS就已经很不错了.JS用两个事件就可以控制. 大伟版主，
你好！ 谢谢你的代码，对我帮助很大，但是当我用到我的文件中的时候，发现有些需要改进的地方，主要是下面的两点：
第一个，如果html页面<div></div>之间没有超级链接的话，div的背景效果就不能显示了！
第二个，可否将图片的边框取掉，
以上两点，只是我的想法，能否单纯用css来实现我就不是很内行了！
如果其他朋友知道的话，也不妨指点一下！
谢谢！ 单纯css要实现DIV换背景图片不可能做到,图片如果去边框在<img>里加border=0
页:
[1]