Tutorial: Menu Wishlist

Yo! Disse a lenda que eu não postava no domingo... Quebrei a teoria. Hoje vim com um tutorial, porque não postei ontem, estava assistindo "Os Vingadores" pela primeira vez -sim, sou atrasada- passou no Pipoca e eu assisti, mas não gostei da história, tipo: Como o Capitão América luta de igual pra igual com o Thor? Achei totalmente sem noção, o Thor devia ser um Deus -ele é um Deus-. Enfim... O tutorial é daquele menu que uso para tags, mas ele também pode ser usado como Wishlist, vou postar as duas ok? Eu nunca sei o que colocar nessa linha -q 

Preview do menu: (www)

Acima de ]]></b:skin> cole:

.listluka {

color:#000; /*cor da fonte*/

font: 8px "verdana"; /*tamanho e tipo da fonte*/

text-transform: uppercase; /*texto em maiúsculo. Apage se não quiser*/

text-align:left; /*alinhamento à esquerda. Mude para center (centro) ou right (direita)*/

background: #eee; /*cor do fundo*/

margin-bottom: 5px;

padding:2px;

padding-left: 8px;

-webkit-transition-duration: .8s; /*duração do efeito*/

border-radius: 2px; /*borda redonda. Se não quiser apague. Se quiser mais redonda aumente o valor*/

border-left: 5px double #baccc5; /*borda da esquerda.*/

}

.listluka:hover {

color:#444;  /*cor da fonte quando passa o mouse*/

padding-left : 15px;

text-shadow: 1px 1px 0px #fff; /*sombra do texto. Se não quiser apague.*/

-webkit-transition-duration: .8s; /*duração do efeito*/

border-left: 20px solid #baccc5; /*borda da esquerda quando passa o mouse.*/

}

Para usar coloque em HTML/JavaScript:

<div class="listluka">TEXTO</div>

Para usar linkado que nem o meu, coloque:

<a href="LINK"><div class="listluka">TEXTO</div></a>

Ajudei? Se reblogar ponha os créditos, foi eu que fiz o menuzinho.