Menu ops

Olá, cupcakes!

Como vão? Espero que bem.... Hoje eu tenho uma prova de Matemática, está bem fácil pelo menos eu espero, o conteúdo tá fácil, então acho que eu vou bem!

Hoje eu trago um menu bem simples, e bonitinho.. É do blog One Dí Things é o Menu Ops:

(Créditos: One Dí Things)

Querem ver?
Leia Mais



Vá em modelo > Editar HTML > E procure por: </b:skin> a cima da tag procurada cole o seguinte código:

#nav {
font-family: Georgia, cursive;
text-transform: uppercase;
width: 60px;
height: 20px;
background: #c2d0d9;
padding: 5px;
text-align: center;
margin: 9px;
align: left;
font-size: 20px;
font-weight: none;
margin-bottom: 3px;
float: left;
cursor: hand;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease; border-radius: 3px;
line-height: 20px;
}
#nav a{
color: #ffffff;
}
#ops {
background: transparent;
color: #415c7b;
width: 80px;
font-family: Georgia;
font-size: 18px;
text-align: center;
margin-top: 10px;
text-transform: none;
opacity: 0;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
}
#nav:hover #ops {
opacity: 1;
-webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease;
}

Mude o que está de vermelho, o primeiro de vermelho é a cor de fundo o segundo é a fonte que vai ficar quando passa o mouse em cima do menu...

Adicione um HTML/Java e nele cole:

<center><div id="nav"><a href="LINK"> 01 <div id="ops">  NADA </div></a></div><div id="nav"><a href="link"> 02 <div id="ops">  NADA </div></a></div><div id="nav"><a href="link"> 03 <div id="ops">  NADA </div></a></div><div id="nav"><a href="link"> 04 <div id="ops">  NADA </div></a></div><div id="nav"><a href="link"> 05 <div id="ops">  NADA</div></a></div><div id="nav"><a href="link"> 06 <div id="ops">  NADA </div></a></div><div id="nav"><a href="link"> 07 <div id="ops">  NADA </div></a></div></center> 

Em link, você coloca a página que você quer ser redirecionado, em 01, 02 e assim por diante é como vai aparecer exemplo: 1 Home em Nada você coloca o que vai aparecer quando passar o mouse exemplo: 2 Tutoriais...
Estão com dúvidas? Comentem!
Beijos!
Ju