10.16.2012

Menu: We Love Moustache



Espero qq gamem.



 

Primeiro, tecle Ctrl+f no seu HTML e procure a tag
]]></b:skin>
Acima da tag, cole esse código:

.tutorialpalomamorais {
font-family: verdana; /*fonte do texto do menu*/
letter-spacing: 1px; /*espaço entre as letras*/
font-size: 11px; /*tamanho da fonte*/
text-transform: uppercase; /*a letra é maiúscula, se não quiser, apague a linha*/
font-weight: none; 
line-height: 10px; /*tamanho da caixa acima*/
background: #EDD3C2; /*fundo*/
color: #000000; /*cor da fonte*/
width: 50px; /*larguda do menu*/
height: 10px; /*autura do menu*/
padding: 5px; /*distancia entre a fonte a o fim da caixinha do menu*/
text-align: center; /*lugar do texto*/
border-radius: 7px; /*bordas nas pontas*/
margin: 4px; /*distância entre o link do menu e outro link*/
float: left; /*flutuação do menu*/
}
.tutorialpalomamorais:hover {
background: #FAE9DE; /*fundo*/
color: #000000; /*cor da fonte*/
border-radius: 7px; /*bordas nas pontas*/
text-decoration:line-through; /*estilo do link hover*/
}
Salve. Depois adicione um HTML/JavaScript, e cole: 
<div class=" tutorialpalomamorais "><a href="LINK">Nome do Link</a></div>
Acho que no próprio código já está a explicação. Na última frase, eu coloquei um riscadinho no hover, mas se não quiserem, apague a linha ou coloquem outro feito, por exemplo se quiserem com mais espacinho, coloquem letter-spacing: 2px; Pra colocar em itálico: font-style: italic; Agora coloquem em negrito, trocando por: font-weight: bold; é isso . Achei no PM'

2 comentários: