Goodies: Menu Close

  

Hey my little monsters!
Com o primeiro tutorial aqui do blog, deixo um menu close, Créditos ao Garota do Olhar Sincero.
Esse menu, ainda não foi usado no blog, talvez, mais só talvez, vou usa-lo, mas acho ele bem legal, e principalmente, se você for usar com um cabeçalho bem chamativo e cheio de brushes!
Se você não sabe como é o menu close aqui vai uma foto para vocês saberem!

Vamos lá então, entre na HTML de seu blog, e de um CTRL+F, procure ]]></b:skin> acima dele cole esse codigo:

.menuclose {
background: #000;
font-size: 15px;
font-family:arial;
color: #888;
text-align: center;
float: left;
margin: 5px;
margin-bottom: 10px;
-webkit-transition-duration: 0.8s;
-webkit-box-shadow: 0 50px 0px #fff transparent;
padding: 8px;
width: 70px;
}
.menuclose:hover {
-webkit-transition-duration: 1.8s;
box-shadow: 0px 100px 0px #a35973 inset;
}
.nav {
height: 70px;
width: auto;
margin-top: 25px;
opacity: 1;
-webkit-transition-duration: 0.5s;
}

background: mude a cor de fundo pra qual cor quiser.

font-size: caso a fonte não fique alinhada, diminua o tamanho dela.

font-family: mude para qual fonte quiser.

fundo hover: mude pra qual cor quer que o fundo fique ao passar o mouse.

<center> <div class="nav">
<a href="LINK" class="menuclose"><font color="#fff">NOME</font></a>
 <a href="LINK" class="menuclose"><font color="#fff">NOME</font></a>
<a href="LINK" class="menuclose"><font color="#fff">NOME</font></a>
<a href="LINK" class="menuclose"><font color="#fff">NOME</font></a>
 <a href="LINK" class="menuclose"><font color="#fff">NOME</font></a>
 </div> </center>