如何用CSS实现鼠标移动到张图片时变换成另一张图片_寒风夜雨

http://blog.sina.com.cn/u/1300753062

首页博文目录关于我

个人资料

微博

加好友发纸条

写留言加关注

博客等级：
博客积分：

博客访问：
关注人气：
获赠金笔：0支
赠出金笔：0支
荣誉徽章：

正文字体大小：大中小

如何用CSS实现鼠标移动到张图片时变换成另一张图片

(2012-12-08 12:00:17)

标签：

css

图片转换

鼠标悬停

平面设计

代码

分类：淘宝旺铺装修

如何用CSS实现鼠标移动到某张图片链接的时候变成另外一张图片，我试了很多方法，发现下面这个方法最好，为了便于大家操作，具体代码如下，只是需要把图片的地址换成自己的就可以啦！并且别忘了修改图片的宽和高哟。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style>
.pp a{
width:130px;
height:30px;
background:url(/Images2008/wyly.jpg);
display:block;
}
.pp a:hover{
width:130px;
height:30px;
background:url(/Images2008/wyly1.jpg);
display:block;
}

</style>
</head>

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

阅读┊ 收藏 ┊ 喜欢 ▼ ┊打印┊举报/Report

前一篇：围巾帽子女包太阳镜淘宝店铺内页装修手册（宝贝详情页页面布局设计稿）

后一篇：揭秘淘宝卖家低价秒杀包邮背后的猫腻

新浪BLOG意见反馈留言板　欢迎批评指正