27 de abr de 2012

Tutorial :Menu 3D


Oii minhas tortinhas de morango com recheio de batata!!Tudo bem?Hoje,vim postar um tutorial do menu aqui do blog.É um menu 3D!!Desculpem a demora para dar uma passadinha,porque assim como a Aninha,essa semana foi uó.



Aaaaah você sabiam que essa doninha faz aniversário hoje?É,pois é...e se me permite mana,surpresinha♥


Créditos mega creditados ao Extras 4 You!

Não deixei gigante se não iria passar...Vamos ao tuto afinal!!!

Vá em Desing > Editar HTML > Dê um Crtl+F e pesquise por:

]]></b:skin>


Acima desse código,cole este outro:


/*---Menu de bordas---*/

menu {

Font-family: verdana; /*Fonte do menu*/

float: left;

background:#B0C4DE; /* Cor do fundo do Menu */

padding: 5px;

text-align: center;

margin: 2px;

width: 22%; /*Tamanho do menu*/

-webkit-transition-duration: .90s; /*Quando tempo dura o efeito*/

border-bottom: 3px solid #9370DB; /*Borda do menu*/

font-size: 11px; /*Tamanho da fonte do menu*/

Color: #9370DB; /*Cor da fonte*/

-webkit-border-radius: 8px /*Bordas arredondadas*/

}
menu:hover {

Font-family: verdana; /*Fonte do menu quando passa o mouse*/

float: left;

margin: 2px;

background:#9370DB; /* Cor do fundo do Menu quando passa o mouse*/

padding: 5px;

text-align: center;

width: 22%; /*Tamanho do menu quando passa o mouse*/

-webkit-transition-duration: .90s; /*Quando tempo dura o efeito quando passa o

 mouse*/

border-bottom: 3px solid #B0C4DE; /*Borda do menu quando passa o mouse*/

font-size: 11px; /*Tamanho da fonte do menu quando passa o mouse*/

Color: #ffffff; /*Cor da fonte quando passa o mouse*/

-webkit-border-radius: 8px /*Bordas arredondadas ao passar o mouse*/

}


Lindas,se vocês seguirem as coordenadas dadas ao lado de cada parte do 

código,não tem erro!!Podem usar como dica minha,cores dessa tabela


Para colocar o Menu,vá em Layout > Add um Gadget > HTML JavaScript e cole:

<a href="Link"><menu>Nome</menu></a>


Mega fácil né?

Gente,por hoje é só,um beijo bem grande no ♥ de vocês.Fui;]



5 comentários:

  1. Obrigada mana te amo mt mt mt mais!! Saiba q vc mora aqui no meu ♥ ta??

    ResponderExcluir
  2. Eu amei esse menu! irei colocar no meu próximo layout!

    mimada-menina.blogspot.com

    ResponderExcluir
  3. Oii eu reblogei o tutorial ta?
    Com os creditos claro

    ResponderExcluir

Olá, aqui temos uma Mini F.a.q pra te auxiliar:

-Não aceitamos Tags e Selinhos
-Precisa de uma Postagem? Pode comentar :)
-Afiliação? Somente na página sobre como se afiliar. Pedidos nos comentários serão desconsiderados
-Por favor, sem xingamentos para o bem de todos
-Nunca deixe a URL do seu blog no final do comentário, o blogger considera isso SPAN e exclui seu blog :(
-Por favor não plageie.
Mais alguma pergunta? Comente aqui ou Leia nossa F.a.q completa

Obrigada