Share a bunch Several practical icon codes made by CSS Sprites include QQ, Tencent Weibo, Sina Weibo, RSS feed, email subscription, QQ space Baidu Icon, copy CSS style to your site if you like Template In CSS, the DIV code is copied to the place you need, and the link address of Weibo QQ, etc. is changed. Note that the path of the picture background should be set correctly. The code is as follows, please see the instructions for use. This is Novice Tutorial :
CSS style section: #qqhao,#qqweibo,#xinlangweibo,#mailico,#qzone,#rssico,#baiduico{background:url(icobg.png) no-repeat;} #qqhao{display:block; width:32px;height:32px; background-position:0 -100px;font-size:0px} #qqweibo{display:block; width:32px;height:32px; background-position:0 -66px;font-size:0px} #xinlangweibo{display:block; width:32px;height:32px; background-position:0 0;font-size:0px} #mailico{display:block; width:32px;height:32px; background-position:0 -33px;font-size:0px} #qzone{display:block; width:32px;height:32px; background-position:0 -168px;font-size:0px} #rssico{display:block; width:32px;height:32px; background-position:0 -134px;font-size:0px} #baiduico{display:block; width:32px;height:32px; background-position:0 -202px;font-size:0px} #qqhao:hover,#qqweibo:hover,#xinlangweibo:hover,#mailico:hover,#qzone:hover,#rssico:hover,#baiduico:hover{filter:alpha(opacity=50); opacity:0.5;-moz-opacity:0.5;} .tubiao{width:300px; height:40px;float:right} .tubiao ul li{list-style-image: none; list-style-type: none;float:left;padding-right:5px}
DIV code part: <div class="tubiao"> <ul> <li><a id="qqhao" href=" http://wpa.qq.com/msgrd?V=1&Menu=yes&Uin=84953409 "Target=" _blank "rel=" nofollow ">QQ contact</a></li> <li><a id="qqweibo" href="#" title="" target="_blank" rel="nofollow">Tencent Weibo</a></li> <li><a id="xinlangweibo" href="#" title="" target="_blank" rel="nofollow">Sina Weibo</a></li> <li><a id="qzone" href="#" title="" target="_blank" rel="nofollow">QQ Space</a></li> <li><a id="mailico" href="#" title="" target="_blank" rel="nofollow">Email subscription</a></li> <li><a id="rssico" href="#" title="" target="_blank" rel="nofollow">RSS feed address</a></li> </ul></div>
Note that the above code href="" fills in the URL, title="" fills in the prompt text, and the picture material should be saved as a file.
Disclaimer:
Website: Click Copy to share with friends!
All content resources shared by this website, if not noted, are original by Blueleaf. If you need to reprint, please indicate the source; Please contact us in case of infringement Contact handling 。 Please understand!