Sitenize Css ve Html İle Hazırlanmış Sosyal Medya İcon Butonu Ekleyin Kodu- HTML KOD CANAVARI

Google+ Facebook Twitter Pinterest Stumbleupon Digg

HTML KOD

<div id="hsocial"> <a class="gplus" href="https://htmlkodcanavarihtmldehasi.blogspot.com/">Google+</a> <a class="facebook" href="https://htmlkodcanavarhtmldehasi.blogspot.com/">Facebook</a> <a class="twitter" href="https://htmlkodcanavarhtmldehasi.blogspot.com/">Twitter</a> <a class="pinterest" href="https://htmlkodcanavarhtmldehasi.blogspot.com/">Pinterest</a> <a class="stumbleupon" href="https://htmlkodcanavarhtmldehasi.blogspot.com/">Stumbleupon</a> <a class="digg" href="https://htmlkodcanavarhtmldehasi.blogspot.com/">Digg</a> </div> </head></head><a target="_blank" href="http://www.htmlkodcanavari.blogspot.com" style="font-size: 6pt; text-decoration: none">Html Kod Canavarı Css Sosyal Medya Butonu</a>

CSS KOD

#hsocial .twitter, #hsocial .twitter:visited { background: url("twitter.png") no-repeat 10px center rgb(0, 172, 237); } #hsocial .facebook, #hsocial .facebook:visited { background: url("facebook.png") no-repeat 10px center rgb(59, 89, 152); } #hsocial .gplus, #hsocial .gplus:visited { background: url("gplus.png") no-repeat 10px center rgb(184, 51, 36); } #hsocial .digg, #hsocial .digg:visited { background: url("digg.png") no-repeat 10px center rgb(0, 0, 0); } #hsocial .stumbleupon, #hsocial .stumbleupon:visited { background: url("stumbleupon.png") no-repeat 10px center rgb(66, 174, 67); } #hsocial .pinterest, #hsocial .pinterest:visited { background: url("pinterest.png") no-repeat 10px center rgb(216, 58, 62); } #hsocial a,#hsocial a:visited{ display:inline-block; margin-right:5px; margin-bottom:5px; padding:10px 15px 10px 40px; color:white; font-weight:bold; text-transform:uppercase; font-size:14px; font-family:'montserratbold',sans-serif; -webkit-transition:all .15s ease-in-out; -moz-transition:all .15s ease-in-out; -ms-transition:all .15s ease-in-out; -o-transition:all .15s ease-in-out; transition:all .15s ease-in-out; } #hsocial a:hover,#hsocial a:visited:hover{ -webkit-opacity:.5;-moz-opacity:.5;opacity:.5;color:white } #hsocial a, a:visited { text-decoration: none; } #hsocial{width:350px;}<a target="_blank" href="http://www.htmlkodcanavari.blogspot.com" style="font-size: 6pt; text-decoration: none">Html Kod Canavarı Css Sosyal Medya Butonu</a>