23 de abr. de 2013

2 Menus - Zombie HTML


Oyasumi Minna-san ^w^
Hoje eu estou meio estranha, nada mata minha fome, estou cheia de dores e uma pessoa em especial não sai da minha cabeça...
Enfim, hoje eu vou meio que fazer um "Especial Zombie HTML" trouxe dois menus que ela fez para vocês, inclusive eu uso um rsrs
Read More if you are interested~~


Menus, Preview (x)

Menu Angel

Vá para sua HTML e procure por ]]></b:skin>, depois cole o seguinte código acima da tag
/* Menu by Zombie Html */
.angel {
font-family: Tahoma; /* fonte */
letter-spacing: 2px;
font-size: 11px; /* Tamanho da fonte */
text-transform: Normal;
border: 1px solid #B5B5B5; /* Borda */
background: #CFCFCF; /* Fundo do Menu */
color: #fff; /* Cor do texto */
width: 50px; /* largura */
height: 17px; /* altura */
float: left;
padding: 2px;
text-align: center; /* alinhamento do texto */
margin: 2px;
border-radius: 2px; /* borda arredondada */
-webkit-transition-duration: .80s; /* transição */
}
.angel:hover {
color: #000; /* cor do texto hover */
border: 1px solid #DF98B5; /* borda hover */
background: #E5C5D6; /* background hover */
-webkit-transition-duration: .80s; /* transição */
}
/* Fim do menu */

Agora, para ultilizar ele, coloque esse código em um Gadget Html/JavaScript
<div class="angel"><a href="LINK">Nome</a></div>
<div class="angel"><a href="LINK">Nome</a></div>
<div class="angel"><a href="LINK">Nome</a></div>
<div class="angel"><a href="LINK">Nome</a></div>
 Menu Simple

Mesma coisa, procure pela tag ]]></b:skin> e acima dela, cole:
/* Menu by Zombie Html */
.simple {
font-family: Tahoma; /* fonte */
letter-spacing: 1px; /* espaço entre as letras */
font-size: 11px; /* Tamanho da fonte */
text-transform: Normal;
border: 1px dotted #CFCFCF; /* Borda */
background: #f1f1f1; /* Fundo do Menu */
color: #CFCFCF; /* Cor do texto */
width: 50px; /* largura */
height: 17px; /* altura */
float: left;
padding: 2px;
text-align: center; /* alinhamento do texto */
margin: 2px;
border-radius: 10px; /* borda arredondada */
-webkit-transition-duration: .50s; /* transição */
}
.simple:hover {
letter-spacing: 3px; /* espaço entre as letras hover */
border: 1px solid #CFCFCF; /* borda hover */
border-radius: 2px; /* borda arredondada hover */
-webkit-transition-duration: .50s; /* transição */
}
/* Fim do menu */

Para usar ele, adicione um gadget de Html/JavaScript e cole:

<div class="simple"><a href="LINK">Nome</a></div>
<div class="simple"><a href="LINK">Nome</a></div>
<div class="simple"><a href="LINK">Nome</a></div>

4 comentários:

  1. Adorei os menus may-chan AOUHSOUAHSOUA'

    http://zombie-of-html.blogspot.com.br/

    ResponderExcluir
  2. AHH amei o seu blog *u* , quando vi a play do Nu'est amei ainda mais , vou ficar relendo seus post antigos ^^

    ResponderExcluir