Menu folhinha

Oiii !!!

Hoje eu estava dando uma passadinha no Bomba de Glitter (www) e vi o tutorial de um menu super fofo.

O Nome dele é o Menu de Folhinha (Já informei no título do post).

Olhem o resultado dele:

Essa imagem pertence á: WWW.

Então, vamos aprender ?!

Enjoy ~~

Vá no seu HTML --> F3 --> Procure por ]]></b:skin> --> Logo acima dele coloque o seguinte código:

/*---Início do Menu com Efeito by Bomba de Glitter---*/
bdg {
font-family: tahoma; /* Fonte do Menu */
width: 17%; /* Tamanho do Menu */
float: left;
background:#8EE5EE; /* Cor do fundo do Menu */
padding: 5px;
text-align: center;
margin: 2px;
-webkit-border-radius: 9px 0px 9px 0px; /* Pontinhas da Borda - não modifique se quiser o formato igual ao meu */
-webkit-transition-duration: .80s; /* Duração do Efeito - não modifique se quiser o efeito igual ao meu */
font-size: 08pt; /* Tamanho da fonte */
color: #fff; /* Cor da fonte */
}
bdg:hover {
font-family: tahoma; /* Fonte do Menu quando passa o mouse */
width: 17%; /* Tamanho do Menu quando passa o mouse */
float: left;
background:#FF69B4; /* Cor do fundo do Menu quando passa o mouse */
padding: 5px;
text-align: center;
margin: 2px;
-webkit-border-radius: 0px 9px 0px 9px; /* Pontinhas da Borda - não modifique se quiser o formato igual ao meu */
-webkit-transition-duration: .80s; /* Duração do Efeito - não modifique se quiser o efeito igual ao meu */
font-size: 08pt; /* Tamanho da fonte do Menu quando passa o mouse */
color: #fff; /* Cor da fonte do Menu quando passa o mouse */
}
/*---Fim do Menu com Efeito by Bomba de Glitter---*/

Depois de ter colado o código, modifique como quiser, todas instruções estão no código, por tanto não tire nenhuma parte do código, principalmente os que estão 'não modifique se quiser um efeito igual ao meu' não esqueçam que não fui eu que escrevi essa parte do código por tanto não fui eu que escrevi 'não modifique se quiser um efeito igual ao meu'. Se caso quiser que o menu fique maior aumente o width para 20% e altere o tamanho da letra. Para colocar na sidebar, coloque:

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

 Depois é só salvar e testar!

Obs. Como eu já tinha informado o menu não nos pertence e sim ao Bomba de Glitter

Menu giratorio!

 Olá flowers

hj eu trago um tuto para vcs

Super fofo e diferente de muitos menus redondos que giram que a gente já viu por ai nos blogs da vida..

Vamos conferir o modelo?

Live Prewiew Aqui

Primeiramente vá até no modelo do blogger e em seguida em editar Html,

Depois dê Ctrl F e procure por:

]]></b:skin>

Depois que achar acima dele cole o seguinte código:

/*** Menu Onders by: Gustavo (escritordapaz) - CrazyHTML ***/

.menuonders {width:53px; height:52px; border-radius:50px 50px 50px 50px; background:#98F5FF; color:#FFF; border:5px solid #FF69B4; text-align:center; font-family:'Tahoma'; font-size:12px; float:left; -webkit-transition-duration:.99s;}

.menuonders:hover {background:#FF69B4; color:#FFF; border:5px solid #98F5FF; -webkit-transform:rotate(360deg); -webkit-transition-duration:.99s;}

Salve vá em layout e adicione o gadget html java script,

feito isso cole dentro o restante dos códigos:

<div class="menuonders"><br><a href="Link">Nome</a></div>

<div class="menuonders"><br><a href="Link">Nome/a></div>

<div class="menuonders"><br><a href="Link">Nome</a></div

Salve e veja o resultado, eu particularmente amo esse menu, eu achei em um tumblr de um menino,  o nome dele é Gustavo e o tumblr dele é o  Crazy HTML!

Lembrando que vocês podem mudar as cores das bordas, dos links,  do fundo do menu o tamanho das bordas, e o tamanho do menu aumentar ou diminuir, e lembrando se quiser mais link é só copiar quantas vezes você quiser a div dos links..

Beijos meus amores.. espero que tenham gostado desse tuto.. 

kissud *-*