DENTASARIM | Tasarımın bizden!
Sosyal ağ kodu v2
Merhabalar, bugün sizlere Sosyal ağ kodunun v2 versiyonununu paylaşacağım.Örnek;
Hiç uzatmadan kodlara geçelim...
<style type="text/css">
#enust {
#enust {
width: 900px;
border-bottom: 2px solid #5cd6f4;
background: #000;
height: 35px;
line-height: 35px;
text-align: right;
}
#enust ul li a img {
width: 35px;
height: 35px;
padding: 0px;
border: 0xp;
}
#enust ul {
list-style: none;
margin: 0px;
padding: 0px;
}
#enust ul li a {
float: left;
width: 35px;
height: 35px;
transition: 0.2s;
}
#enust ul li a.facebook:hover {
background: #2b83dc;
}
#enust ul li a.twitter:hover {
background: #0abdff;
}
#enust ul li a.linkedin:hover {
background: #4685d4;
}
#enust ul li a.instagram:hover {
background: #996b3a;
}
#enust ul li a.flickr:hover {
background: #b92f83;
}
#enust ul li a.spotify:hover {
background: #4bdc3c;
}
#enust ul li a.sound:hover {
background: #ff7200;
}
#enust ul li a.lastfm:hover {
background: #ff0000;
}
#enust ul li a.kikstarter:hover {
background: #43c853;
}
#enust ul li a.github:hover {
background: #4382c8;
}
</style>
</style>
<div id="enust">
<ul>
<li><a href="#"class="facebook"><img src="http://benhodgson.net/codepen/social/facebook-128.png" alt="" /></a></li>
<li><a href="#"class="twitter"><img src="http://benhodgson.net/codepen/social/twitter-128.png" alt="" /></a></li>
<li><a href="#"class="linkedin"><img src="http://benhodgson.net/codepen/social/linkedin-128.png" alt="" /></a></li>
<li><a href="#"class="instagram"><img src="http://benhodgson.net/codepen/social/instagram-128.png" alt="" /></a></li>
<li><a href="#"class="flickr"><img src="http://benhodgson.net/codepen/social/flickr-128.png" alt="" /></a></li>
<li><a href="#"class="spotify"><img src="http://benhodgson.net/codepen/social/spotify-128.png" alt="" /></a></li>
<li><a href="#"class="sound"><img src="http://benhodgson.net/codepen/social/soundcloud-128.png" alt="" /></a></li>
<li><a href="#"class="lastfm"><img src="http://benhodgson.net/codepen/social/lastfm-128.png" alt="" /></a></li>
<li><a href="#"class="kikstarter"><img src="http://benhodgson.net/codepen/social/kickstarter-128.png" alt="" /></a></li>
<li><a href="#"class="github"><img src="http://benhodgson.net/codepen/social/github-128.png" alt="" /></a></li>
</ul>
</div>
Kodlarımız bu kadar başka sitelerde kaynak göstermeden paylaşmak yasaktır.!