作用:一张图片上的不同小图标定位到确定位置
示例:
html代码:
<div>
<p>关注我们</p>
<div class="sm-img">
<div id="sm-img1"></div>
<div id="sm-img2"></div>
<div id="sm-img3"></div>
</div>
css代码:
.sm-img div{
width: 50px;
height: 50px;
margin-right: 45px;
background-color: #52BBFF;
border-radius: 50%;
background-image: url(../img/footer_focus.png);
background-repeat: no-repeat;
cursor:pointer;
float:left;
}
#sm-img1{
background-position: 0 8px;
}
#sm-img2{
background-position: -90px 10px;
}
#sm-img3{
background-position: -180px 10px;
}