amirtc
چهارشنبه 21 آبان 1393, 21:14 عصر
#social{
padding:5px;
margin-top:40px;
float:left;
display:inline-block;
height:32px;
}
#social a{
display:inline-block;
width:80px;
height:128px;
margin-right:2px;
margin-left:2px;
float:left;
}
#social a:hover{
-moz-transform: translateY(10px);
-webkit-transform: translateY(10px);
-o-transform: translateY(10px);
-ms-transform: translateY(10px);
transform: translateY(10px);
}
#social a.icoa{background:url(../images/fb.png) no-repeat center center;}
#social a.icob{background:url(../images/rs.png) no-repeat center center;}
#social a.icoc{background:url(../images/sk.png) no-repeat center center;}
#social a.icod{background:url(../images/gm.png) no-repeat center center;}
#social a.icoe{background:url(../images/tw.png) no-repeat center center;}
<div id="social"><a class="icob" href="http://www.learnblog.ir/feed" title="لرن بلاگ با خبرخوان دنبال کنید"></a><a class="icod" href="" title="لرن بلاگ در گوگل"></a><a class="icoa" href="http://www.facebook.com/myvahab" title="لرن بلاگ در فیسبوگ"></a><a class="icoc" href="" title="لرن بلاگ در اسکایپ"></a><a class="icoe" href="" title="لرن بلاگ در تویتر"></a></div>
یه دیو social تعریف کرده داخلش تگ های a رو تعریف کرده و برای هاور a ها از خاصیت transform استفاده کرده.