• - ChapStique -

    - ChapStique -

  • - Crouton -

    - Crouton -

  • - Nadaddy -

    - Nadaddy -

  • - Fatty -

    - Fatty -

  • - Hollywood -

    - Hollywood -

6 de novembro de 2012

Alguns menus + Desculpe

Olá teens, não sei se sentiram minha falta, mas eu não tenho postado aqui à mais de uma semana, e queria me desculpar, é que realmente estou sem tempo, por causa da escola, e outras coisas que estou resolvendo. Mas hoje estou aqui (: 
Como já faz um tempo que não posto, trouxe algo legal, alguns menus que aprendi em alguns tumblr's, querem ver??


Menu Sweet - Créditos (www)
Para visualizá-lo clique aqui
- Em seu HTML procure por ]]></b:skin>
- Acima cole o seguinte código:
.menu {background: #fec7cc; font-size: 10px; font-family:verdana; color: #de7689; text-align:center; height:13px; width:197px; margin:2px; border:1px solid #eb8a9c; border-top:1px solid #eb8a9c; border-left:4px solid #eb8a9c; display: inline-block;text-shadow: 0 1px 1px #fff; font-weight:bold; padding-top: 2px; padding-bottom: 6px; margin-bottom: -3px; border-top: 1px solid #eb8a9c;} .menu:hover {background: #fedbde;}
Edite as cores e salve 

- Agora adicione um Gadget HTML/CSS e cole:
<a href="link" class="menu"><font color="#de7689">Nome</font></a> <a href="link" class="menu"><font color="#de7689">Nome</font></a> <a href="link" class="menu"><font color="#de7689">Nome</font></a>
Edite com seus links e salve 
Menu Button - Créditos (www)
Clique aqui para visualizar
 - Em seu HTML procure por ]]></b:skin>
- Acime cole o seguinte código:
/** MENU BUTTON **/
@font-face {font-family: "04b03"; src: url('http://static.tumblr.com/qbzesex/2tSm7y7gy/04b_03_.ttf'); format("truetype"); }#menubutton a{position:relative; text-decoration:none; text-align:center; background-color:#00ab38; font: 8px "04b03", small-fonts;color:#fff; display: inline; width:15px; border:2px solid #fff; border-color:#00f050 #007828 #004517 #00de4a; padding:1em; margin:1em auto; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}
#menubutton a:hover {top:2px; left:2px; color:#fff; border-color:#004517 #00de4a #00f050 #007828;}
Mude as cores e salve 

 - Agora adicione um gadget HTML/CSS e cole:

<div id="menubutton"> <a href="LINK">01</a> <a href="LINK">02</a> <a href="LINK">03</a> </div>
Edite com os links

Menu Roll - Créditos (www)
Visualize aqui
- Em seu HTML procure por ]]></b:skin>
- Acima cole:

/** MENU ROLL **/.menu {font-family: 'Calibri'; font-size: 11px; text-transform: uppercase; width: 150px; -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.2); -moz-box-shadow: 2px 2px 5px rgba(0,0,0,0.2); box-shadow: 2px 2px 5px rgba(0,0,0,0.2);} .menu h4 {border-bottom: 1px solid rgba(0,0,0,0.3); border-top: 1px solid rgba(255,255,255,0.2); color: #fff; font-size: 15px; font-weight: 500; padding: 7px 12px; background: #a90329; -webkit-transition-duration: 1s; -moz-transition-duration: 1s; -o-transition-duration: 1s; transition-duration: 1s;} .menu h4:hover {background: #cc002c; -webkit-transition-duration: 1s; -moz-transition-duration: 1s; -o-transition-duration: 1s; transition-duration: 1s;} .menu li, .menu li a {text-decoration: none; color: #888; background: #f0f0f0; border-bottom: 1px solid #e0e0e0; -webkit-transition-duration: 1s; -moz-transition-duration: 1s;} .menu li:hover, .menu li a:hover {background: #e0e0e0; -webkit-transition-duration: 1s; -moz-transition-duration: 1s;} .menu ul {margin-top: -25px; background: #fff; line-height: 24px; list-style-type: none; overflow: hidden; padding: 0px; height: 0px; -webkit-transition: height 1s ease; -moz-transition: height 1s ease;} .menu:hover ul {height: 100px;}
Edite como preferir e salve

- Agora adicione um gadget HTML/CSS e cole:
<div class="menu"> <h4>Navegue</h4><ul> <li><a href="LINK">Nome</a></li> <li><a href="LINK">Nome</a></li> <li><a href="LINK">Nome</a></li> <li><a href="LINK">Nome</a></li> </ul></div>
Edite com seus links e salve 

Menu  Downward - Créditos (www)
Clique aqui para ver
- Em seu HTML procure por ]]></b:skin>
- Acima cole:

/** CAIXA DO MENU **/
.menu12 {font-size: 12px; font-family:georgia; color: #9B8147 ; float:left; padding:4px; text-align:center; height:20px;margin:2px;background:#336666;width:25px; box-shadow: 0 0 5px #fff;border-radius:5px;
-webkit-border-bottom-right-radius: 45px;
-webkit-border-bottom-left-radius: 45px;
-moz-border-radius-bottomright: 45px;
-moz-border-radius-bottomleft: 45px;
border-bottom-right-radius: 45px;
NU HOVER **/
.menu12:hover {font
border-bottom-left-radius: 45px;
filter: alpha(opacity=75);
moz-opacity:.80;
opacity:.80 ;
-webkit-transition-duration: .86s;
border-top: 3px solid #9B8147 ;
cursor:default;
} /** CAIXA DO M
E-size: 12px; font-family:georgia; color: #336666; float:left; padding:4px; text-align:center; height:55px;margin:2px;background:#9B8147 ;width:25px; box-shadow: 0 0 5px #fff;border-radius:5px;
er-bottom-left-radius: 45px;
filter: alph
-webkit-border-bottom-right-radius: 45px;
-webkit-border-bottom-left-radius: 45px;
-moz-border-radius-bottomright: 45px;
-moz-border-radius-bottomleft: 45px;
border-bottom-right-radius: 45px;
bor
da(opacity=100);
moz-opacity:1.0;
opacity:1.0;
border-top: 7px solid #336666;
cursor:default;
}

Edite as cores e salve

- Adicione um gadget HTML/CSS e cole:
<a href=”LINK” class=”menu12”>TEXTO</a>
Edite com seus links e salve 


Bom é isso, espero que tenham gostado.
Se usarem creditem os tumblrs que eu creditei ok?
Beijos

12 comentários:

  1. Nem precisar se desculpa flor os estudos vão sempre está no primeiro lugar,adorei os menus
    beeijos

    Gotas de fofura

    ResponderExcluir
  2. Que bom que voltou fofa *OOOOOOO*

    Adorei os menus, muito fofs

    kissus~~

    ResponderExcluir
    Respostas
    1. Ain, obrigada, adoro quando me chamam de fofa *o*
      também adorei esses menus

      Excluir
  3. Lindos os menus!!
    Luh
    my-crazy-world-by-luh.blogspot.com

    ResponderExcluir
  4. Todos lindos, mas gostei mais do menu Roll e do Sweet. :3

    ResponderExcluir
  5. Todos fofos, adorei o primeiro!

    http://tvfabulous.blogspot.com

    Bjs,
    Sté

    ResponderExcluir
  6. Achei bem criativo esse post co vários tipos de menus!

    ResponderExcluir
  7. Oi flor tudo bem?
    Estoi te seguindo e seu blog é lindo um dos mais lindos que já vi ;)
    Você segue o meu??
    Beijos :*
    sweet-cherry-lu.blogspot.com.br

    ResponderExcluir