1-Faça o login no blogger
2-vai em Design
3-Elementos da página
4-Adicionar gadget - HTML/JavaScripit
e cole o seguinte código :
<style>
/* menu hover--------------------------------------------- */
#menuhover {
display: inline;
}
#menuhover li {
list-style-type:none;padding: 0 2px;
}
#blogger1 {
background: url(http://2.bp.blogspot.com/_BaCxSD9NFn8/S3C-A8ggT6I/AAAAAAAABPU/4DNs2JPg3ew/s1600/bloggerc.png) no-repeat;
width: 70px;
height: 70px;
float: left;
clear: right;
}
#feedbourner1 {
background: url(http://4.bp.blogspot.com/_BaCxSD9NFn8/S3C-L0HGdXI/AAAAAAAABPs/kXpZirBI9Hg/s1600/feedburnerc.png) no-repeat;
width: 70px;
height: 70px;
float: left;
clear: right;
}
#twitter1 {
background: url(http://1.bp.blogspot.com/_BaCxSD9NFn8/S3C-pyr384I/AAAAAAAABQM/BoeY3vrTjRs/s1600/twitterc.png) no-repeat;
width: 70px;
height: 70px;
float: left;
clear: right;
}
#facebook1 {
background: url(http://4.bp.blogspot.com/_BaCxSD9NFn8/S3C-Lvvjn2I/AAAAAAAABPc/9-9QGVwWIpQ/s1600/facebookc.png) no-repeat;
width: 70px;
height: 70px;
float: left;
clear: right;
}
#blogblogs1 {
background: url(http://4.bp.blogspot.com/_BaCxSD9NFn8/S3C-A76yB9I/AAAAAAAABPM/GIWCOx-NZXE/s1600/blogblogsc.png) no-repeat;
width: 70px;
height: 70px;
float: left;
clear: right;
}
#technoraty1 {
background: url(http://2.bp.blogspot.com/_BaCxSD9NFn8/S3C-p410AzI/AAAAAAAABQE/VSbWkzAeuyc/s1600/technoratic.png) no-repeat;
width: 70px;
height: 70px;
float: left;
clear: right;
}
#orkut1{
background: url(http://4.bp.blogspot.com/_BaCxSD9NFn8/S3C-darM78I/AAAAAAAABP8/YhRQz4g0tl4/s1600/orkutc.png) no-repeat;
width: 70px;
height: 70px;
float: left;
clear: right;
}
#youtube1{
background: url(http://1.bp.blogspot.com/-ec-GPpE3cSs/TjCYsrLEt8I/AAAAAAAAFyc/uVR6nAsyuJc/s1600/youtubec.png) no-repeat;
width: 70px;
height: 70px;
float: left;
clear: right;
}
#favoritos1{
background: url(http://4.bp.blogspot.com/_BaCxSD9NFn8/S3C-Lvb_GXI/AAAAAAAABPk/KPPxDuQFNNs/s1600/favoritesc.png) no-repeat;
width: 70px;
height: 70px;
float: left;
clear: right;
}
/*hover*/
#blogger1:hover {
background: url(http://1.bp.blogspot.com/_BaCxSD9NFn8/S3C-Aw1Pi1I/AAAAAAAABPQ/0ckUW3EopWE/s1600/blogger.png) 0 0 no-repeat;
}
#feedbourner1:hover {
background: url(http://4.bp.blogspot.com/_BaCxSD9NFn8/S3C-LvTzR3I/AAAAAAAABPo/aiXPzXzhSQY/s1600/feedburner.png) 0 0 no-repeat;
}
#twitter1:hover {
background: url(http://2.bp.blogspot.com/_BaCxSD9NFn8/S3C-p-dg-mI/AAAAAAAABQI/S6uKYvq4T5c/s1600/twitter.png) 0 0 no-repeat;
}
#facebook1:hover {
background: url(http://3.bp.blogspot.com/_BaCxSD9NFn8/S3C-BJQQ5oI/AAAAAAAABPY/VmZRCCbYs3Y/s1600/facebook.png) 0 0 no-repeat;
}
#orkut1:hover {
background: url(http://2.bp.blogspot.com/_BaCxSD9NFn8/S3C-deQGG7I/AAAAAAAABP4/iYTOHKsvBpk/s1600/orkut.png) 0 0 no-repeat;
}
</style>
<div id="menuhover">
<ul>
<li><a href="PERFIL DO BLOGGER" id="blogger1" target="_blank" title="Perfil"></a></li>
<li><a href="ENDEREÇO DO FEED" id="feedbourner1" target="_blank" title="FeedBorner"></a></li>
<li><a href="ENDEREÇO DO TWITTER" id="twitter1" target="_blank" title="Siga-me no Twitter"></a></li>
<li><a href="ENDEREÇO D O FACEBOOK" id="facebook1" target="_blank" title="Facebook"></a></li>
<li><a href="ENDEREÇO DO ORKUT" id="orkut1" target="_blank" title="Orkut"></a></li>
</ul>
</div>
0 Comentários:
Postar um comentário