Menu Navegação

Oi Oi Oi

Estou lendo um livro super divo, são Crônicas de Gelo e Fogo de George R. R. Martin, quando eu termina-lo vou fazer uma resenha sobre ele aqui o que acham? Mas já adianto que se você estiver de TPM e ler algumas partes de lá você chora, provavelmente não vai chorar, mas eu estava que nem uma louca quando o *Alerta de Spoiler* Ned se ofereceu para matar a Lady a loba gigante da Sansa #Morri. Tem também o velho gordo do Rei Robert tramando assassinato da Daenerys.

Bom, este menu é lá do QPMN então créditos a ela ok? Eu já tinha postado ele no SLH, mas como ninguém comenta direito e eu estou com preguiça, se deliciem com este menu.

Resultado final

Para verem melhor: http://tutorialradioactive.blogspot.com.br/

Parte CSS

Vá em editar html e procure para facilitar ]] logo após que achar isto cole acima do que você achou destacado, este código:

.nav1 { font-size: 10px; 

width: 165px; 

text-transform: uppercase; 

display: block; 

text-decoration: none;

background-color:#2c2c2c; 

padding: 3px 0 3px 0; 

margin:0 0 1px 0;

text-align:center; 

margin: 0 0 2px 0;

position:relative;border-left: 15px solid #666666;}

.nav1:hover {-webkit-transition-duration: .40s;

background-color:#a9a9a9;

text-align:center; 

letter-spacing: 4px;}

Entendendo o código

Bem, eu já pus em negrito os lugarem aonde vocês iram poder modificar, em width é a largura do seu menu, em background-color é a cor do seu menu e no background-color no hover é seu menu quando passa o mouse.

Aplicando no layout

Cole o código a seguir onde quer seu menu:

<div style=" float: right;">

<a href="Url" ;  div class="nav1"><font color="#fff">Nome</font></a>

<a href="Url" ;  div class="nav1"><font color="#fff">Nome</font></a>

<a href="Url" ;  div class="nav1"><font color="#fff">Nome</font></a>

<a href="Url" ;  div class="nav1"><font color="#fff">Nome</font></a>

</div>

Então é isso pessoal!

Chu~ /lê roba tchau da Aninha-Chan