Tutorial: Menu Express

Oiie pessoas de algum fandom!

Boa tarde ^^

Hoje eu recebi um pedido na MINHA ask.fm do tutorial do Menu Express.

~ Live Preview

Gostaram?
Bora aprender.

Procure por:

]]></b:skin>

Acima, cole:

@font-face {font-family: "handy"; src: url('http://static.tumblr.com/lnvca6d/E6vm63ih7/pf_ronda_seven__1_.ttf');}

.express {

background-color: #CORDOFUNDO; 

color: #FFFFFF; 

display: block; 

width: LARGURADOMENUpx; 

height: 15px; 

line-height: 13px; font-family: handy; font-size: 8px; text-align: center; text-decoration: none; text-transform:uppercase; margin-right: 1px; margin-bottom: 1px; padding-top: 2px; text-align: center; -webkit-transition: all 0.4s ease-out; -moz-transition: all 0.4s ease-out;text-transform: uppercase;}

.express:hover {opacity: 0.5; margin-left: -30px;}

Onde está em vermelho, é a cor do menu.

Onde está em rosa, é a largura do menu, por exemplo, quanto maior o título que você usará vai ter que aumentar a largura.

Salve e pra colocar no seu blog adicione um gadget em HTML com esse código:

<center><a href="http://SEULINK" class="express">NOME</a>

<a href="http://SEULINK" class="express">NOME</a>

<a href="http://SEULINK" class="express">NOME</a>

<a href="http://SEULINK" class="express">NOME</a>

<a href="http://SEULINK" class="express">NOME</a></center>

Altere o que for preciso e pronto.

Espero ter ajudado ^^

Beijoos!