حصريا اضافة مترو المواقع الاجتماعية بشكل جديد

  السلام عليكم معكم Yassine Barra اليوم سوف اقدم لكم كود Html سهل التركيب و بطريقة احترافية 



                                     ايقونات على هذا شكل
 

كود

غير بلون أزرق بما يناسبك

<center><style type="text/css">
.btnt-chronicl-social {  width: 250px;  margin: 0px;  }
.btnt-chronicl-social ul {  margin: 0;  padding: 0;  }
.btnt-chronicl-social ul li {  list-style:none;   padding: 0; text-transform: none; }
.btnt-chronicl-social ul li a {   color: #fff;   display:block;  }
.btnt-chronicl-social ul li a:hover {  color: #ffffff;  background-color: #35B0F2;   }
.btnt-chronicl-social ul li .rss { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/RSS-1.png") no-repeat scroll 10px center #F87E12; background-size: 20px; padding: 17.5px 45px; }
.btnt-chronicl-social ul li .twitter { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/Twitter.png") no-repeat scroll 10px center #4CACEE; background-size: 20px; padding: 17.5px 45px;}
.btnt-chronicl-social ul li .facebook { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/Facebook-1.png") no-repeat scroll 10px center #3B5998; background-size: 20px; padding: 17.5px 45px; }
.btnt-chronicl-social ul li .google { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/google.png") no-repeat scroll 10px center #D44937; background-size: 20px; padding: 17.5px 45px; }
.btnt-chronicl-social ul li .linkedin { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/LinkedIn-1.png") no-repeat scroll 10px center #3692C3; background-size: 20px; padding: 17.5px 45px; }
</style>

<div class="btnt-chronicl-social">
<ul>
<li><a class="rss" href="http://feedburner.google.com">اشترك في RSS</a></li>
<li><a class="twitter" href="https://twitter.com">تابعنى على تويتر</a></li>
<li><a class="facebook" href="https://www.facebook.com/ilon.barra">تابعنا على فيس بوك</a></li>
<li><a class="google" href="https://plus.google.com/110271545641741261566/">انضم الينا عبر Google+</a></li>
</ul>
</div></center>