css 图片精灵 位置定位

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>css 小精灵位置定位</title>
<style type="text/css">
div {
margin: auto;
/* width: 60%; */
/* border: 3px solid #73AD21;
padding: 10px; */
}
#home {
width: 120px;
height: 120px;
background: url('images/cssicon.jpg') 0 0;
}
#home:hover {
background: url('images/cssicon.jpg') 0 -120px;
}
</style>
</head>
<body>
<div>
<img id="home" src="http://www.w3schools.com/css/img_trans.gif">
<!-- <p><img src="images/cssicon.jpg"></p> -->
</div>
</body>
</html>

posted @ 2018-05-07 10:38  quitpoison  阅读(576)  评论(0)    收藏  举报