代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>亚马逊</title>
<style type="text/css">
.box1:link{
display: block;
width: 113px;
height: 38px;
background-image: url(amazon-sprite_.png);
background-position: -9px -9px;
}
.box1:hover{
background-image: url(amazon-sprite_.png);
background-position:-9px -45px;
}
.box1:active{
background-image: url(amazon-sprite_.png);
background-position:-5px -82px;
}
.box2:link{
display: block;
width: 42px;
height: 30px;
background-image: url(amazon-sprite_.png);
background-position: -8px -338px;
}
.box2:hover{
background-image: url(amazon-sprite_.png);
background-position:-58px -338px;
}
.box2:active{
background-image: url(amazon-sprite_.png);
background-position:-128px -338px;
}
</style>
</head>
<body>
<a href="#" class="box1"></a>
<a href="#" class="box2"></a>
</body>
</html>
效果图：
4.png
网友评论