如何用CSS实现鼠标移动到某张图片链接的时候图片变成另外一张？

 我来答

2个回答

#热议# 生活中有哪些实用的心理学知识？

rileyliu
推荐于2016-11-25 · TA获得超过478个赞

知道答主

回答量：220

采纳率：0%

帮助的人：236万

我也去答题访问个人页

关注

展开全部

给你一个完整的代码，只需要加载自己的图片就可以用了（宽和高别忘了根据自己的图片也要修改）！

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style>

.pp a{
width:575px;
height:157px;
background:url(1.jpg);/*图片地址*/
display:block;
}
.pp a:hover{
width:575px;
height:157px;
background:url(2.jpg);/*替换的图片地址*/
display:block;
}
</style>
</head>

<body>
<div class="pp"><a href="#"></a></div>
</body>
</html>

已赞过 已踩过<

评论收起

夸克

广告2024-11-12

PDF在线转换-快速转换-一键在线转换-下载2024安卓最新版

b.quark.cn

凯叔的故事堂
2019-10-23 · TA获得超过3765个赞

知道大有可为答主

回答量：3098

采纳率：29%

帮助的人：474万

我也去答题访问个人页

关注

展开全部

给你一个完整的代码，只需要加载自己的图片就可以用了（宽和高别忘了根据自己的图片也要修改）！
<!DOCTYPE
html
PUBLIC
"-//W3C//DTD
XHTML
1.0
Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta
http-equiv="Content-Type"
content="text/html;
charset=gb2312"
/>
<title>无标题文档</title>
<style>
.pp
a{
width:575px;
height:157px;
background:url(1.jpg);/*图片地址*/
display:block;
}
.pp
a:hover{
width:575px;
height:157px;
background:url(2.jpg);/*替换的图片地址*/
display:block;
}
</style>
</head>
<body>
<div
class="pp"><a
href="#"></a></div>
</body>
</html>