~~~
<style>
*{margin:0;padding:0;)
.allIcon{
width:300px;
height:400px;
margin:0 auto;
border:1px solid #ccc;
}
.allIcon a{
display:inline-block;
position:relative;
width:30px;
height:30px;
border-radius:50%;
background:#ccc;
}
.allIcon span{
position:absolute;
display:inline-block;
width:18px;
height:18px;
background:url("images/icons_type.png") no-repeat;
left:50%;
top:50%;
margin-left:-9px;
margin-top:-9px;
}
.allIcon .qq{
background-position-x:-19px;
}
.allIcon .weibo{
background-position-y:-38px;
}
</style>
~~~
![](https://box.kancloud.cn/451cf326ccbb31471e175af89e14f9c2_107x18.png)
~~~
<boby>
<div class="allIcon">
<a href="#"><span class="qq"></span></a>
<a href="#"><span class="weibo"></span></a>
</div>
</body>
~~~
![](https://box.kancloud.cn/94138e8bcf84d5c478b9819fbaccf8cf_309x409.png)