www.gusucode.com > 200套html5精品模板51_75 > 074/css/social.css
/* Vars ----------------------------------------------------*//* Mixins ----------------------------------------------------*/#social-bar { display: block; clear: left; float: left; position: relative; margin-top: 10px; } #social-bar li { display: block; float: left; position: relative; overflow: hidden; width: 32px; height: 32px; margin-left: 5px; margin-right: 5px; margin-bottom: 5px; } #social-bar li a { position: absolute; height: 64px; width: 32px; top: 0; left: 0px; background-repeat: no-repeat; -webkit-transition: all 0.15s ease; -moz-transition: all 0.15s ease; -o-transition: all 0.15s ease; transition: all 0.15s ease; } #social-bar li a:hover { top: -32px; } #social-bar .dribbble a { background-image: url('../img/social/dribbble.png'); } #social-bar .facebook a { background-image: url('../img/social/facebook.png'); } #social-bar .flickr a { background-image: url('../img/social/flickr.png'); } #social-bar .forrst a { background-image: url('../img/social/forrst.png'); } #social-bar .github a { background-image: url('../img/social/github.png'); } #social-bar .googleplus a { background-image: url('../img/social/googleplus.png'); } #social-bar .lastfm a { background-image: url('../img/social/lastfm.png'); } #social-bar .linkedin a { background-image: url('../img/social/linkedin.png'); } #social-bar .rss a { background-image: url('../img/social/rss.png'); } #social-bar .twitter a { background-image: url('../img/social/twitter.png'); } #social-bar .vimeo a { background-image: url('../img/social/vimeo.png'); } #social-bar .youtube a { background-image: url('../img/social/youtube.png'); }