Anuncie aqui!

    Como Coloca Menu Hover no Blog

    segunda-feira, 3 de setembro de 2012

    Vamos Ao Tutorial


    Primeiro vá no Blogger/ design/ Editar html.

    aperte CTRL + F e procure por ]]></b:skin>

    depois copie o código abaixo e cole acima do   ]]></b:skin>


    /*-----Menu azu grande -----*/
    #menuimagem{
    width:100px;
    height:100px;
    display:block;
    position:absolute;
    margin:245px 0 0 25px;
    }
    #home {
    background:url(http://i.imgur.com/NqWvf.png) no-repeat;
    width:173px;
    height:70px;
    float:left;
    }
    #home:hover {
    background:url(http://i.imgur.com/HS6I5.png) no-repeat;
    width:173px;
    height:70px;
    float:left;
    }
    #HOME{
    width:208px;
    height:57px;
    display:block;
    position:absolute;
    margin:-22px 0 0 20px;
    }
    #contato2 {
    background:url(http://i.imgur.com/3Bt5V.png) no-repeat;
    width:173px;
    height:70px;
    float:left;
    }
    #contato2:hover {
    background:url(http://i.imgur.com/r6QwN.png) no-repeat;
    width:173px;
    height:70px;
    float:left;
    }
    #CONTATO2{
    width:208px;
    height:57px;
    display:block;
    position:absolute;
    margin:-22px 0 0 200px;
    }
    #parceria {
    background:url(http://i.imgur.com/Sd3sj.png) no-repeat;
    width:173px;
    height:70px;
    float:left;
    }
    #parceria:hover {
    background:url(http://i.imgur.com/ZZghD.png) no-repeat;
    width:173px;
    height:70px;
    float:left;
    }
    #PARCERIA{
    width:208px;
    height:57px;
    display:block;
    position:absolute;
    margin:-22px 0 0 380px;
    }
    #anuncie {
    background:url(http://i.imgur.com/cL5ic.png) no-repeat;
    width:173px;
    height:70px;
    float:left;
    }
    #anuncie:hover {
    background:url(http://i.imgur.com/hBzrc.png) no-repeat;
    width:173px;
    height:70px;
    float:left;
    }
    #ANUNCIE{
    width:208px;
    height:57px;
    display:block;
    position:absolute;
    margin:-22px 0 0 560px;
    }
    #equipe {
    background:url(http://i.imgur.com/crnVs.png) no-repeat;
    width:173px;
    height:70px;
    float:left;
    }
    #equipe:hover {
    background:url(http://i.imgur.com/AKY0B.png) no-repeat;
    width:173px;
    height:70px;
    float:left;
    }
    #EQUIPE{
    width:208px;
    height:57px;
    display:block;
    position:absolute;
    margin:-22px 0 0 741px;
    }
    /*-----Menu azu grande fim -----*/



    e abaixo de <body> cole o codigo abaixo mudando os links valew
    depois visualize e se estiver file vc salva

    <table align='center' border='0' cellpadding='0' cellspacing='0' width='1000'> 
    <tr>
        <th scope='col'>
    <div id='menuimagem'>
    <div id='HOME'>
    <a href='http://megadesignermd.blogspot.com.br/' id='home' title='Volte Para a Pagina Inicial'/>
    </div>
    <div id='CONTATO2'>
    <a href='http://megadesignermd.blogspot.com.br/search/label/contato' id='contato2' title='Entre em Contato !'/>
    </div>
    <div id='PARCERIA'>
    <a href='http://megadesignermd.blogspot.com.br/search/label/parceria' id='parceria' title='Faça Parceria !'/>
    </div>
    <div id='ANUNCIE'>
    <a href='http://megadesignermd.blogspot.com.br/search/label/pedidos' id='anuncie' title='Faça Sua Propaganda !'/>
    </div>
    <div id='EQUIPE'>
    <a href='http://megadesignermd.blogspot.com.br/search/label/seja%20da%20equipe' id='equipe' title='Faça Seu Pedido !'/>
    </div>
    <div id='FAQ'>
    <a href='bleach@live.com/' id='faq' title='Dúvidas ?  Retire - a Agora mesmo !'/>
    </div>
    </div>
    </th>
     </tr>
    </table>


    0

    Postar um comentário