这个效果不能直接用在<a>标签里？
<html>
<head>
<style type= "text/css ">
<!--
#c {
background:url(2.gif) no-repeat top left;
text-align:center;
width: 135px;
height: 25px;
padding-bottom: 0px;
margin-left: 355px;
}
#c a:hover {background:url(2.gif) no-repeat bottom left;
text-align:center;
width: 135px;
height: 25px;
padding-bottom: 0px;
}
-->
</style>
<title> test cover
</title>
</head>
<body>
<p id= "c ">
<a href= "# "> hello </a>
</p>
</body>
</html>
=========
2.gif是一个长135px,宽50px的图像
他是这样形式的
|----红---------|
------蓝---------
|----------------|
我想实现的是，当把鼠标放在这链接上时，通过
background:url(2.gif) no-repeat bottom left;
就使用蓝色的背景．
但我怎么
上面这些样式要放在
<p> 标签里才行呢，
我直接
＜a href= "# " id= "c "> hello </a>
这样他的背景为什么不会变呢？
[解决办法]
<html>
<head>
<style type= "text/css ">
<!--
a{
width:135px;
background:url(images/abg.gif) no-repeat;
display:block;
text-align:center;
line-height:25px;
}
a:hover{
background-position:0 -25px;
}
-->
</style>
<title> test cover
</title>
</head>
<body>
<p>
<a href= "# "> hello </a>
</p>
</body>
</html>
[解决办法]
#c a:hover {}
改成
#c:hover {}
[解决办法]
#c a:hover {}
楼主明白这是什么意思么？
[解决办法]
x:hover 是鼠标移到x元素上的样式
a:hover 是鼠标移到链接上的样式
#c:hover 是鼠标移到 id 为 c 的元素上的样式
同理 .c:hover 就是鼠标移到 class 为 c 的元素上的样式
