terça-feira, 8 de junho de 2010

Menu horizontal Verde

http://easycaptures.com/fs/uploaded/359/2889524745.jpg
Esse é um menu muito bom pra você estar colocando no topo da sua página.Para colocar é muito fácila, apenas copie o código abaixo...

<style type="text/css">
#outer {
border-top:6px solid #004400;
margin:50px 0 150px;
padding-top:1px;
}
#point {
background:no-repeat scroll right bottom #004400;
display:table;
list-style:none outside none;
margin:0 auto;
padding:0;
white-space:nowrap;
}

#point li.first {
background:url no-repeat scroll left bottom transparent;
}
#point li {
display:table-cell;
margin:0;
padding:0;
}
#point li a:hover, #point li a.current {
background:no-repeat scroll center top transparent;
color:#FFFF00;
}
#point li a {
color:#FFFFFF;
float:left;
font-family:arial;
font-size:11px;
font-weight:bold;
letter-spacing:1px;
padding:5px 15px;
text-decoration:none;
}

#point li {
display:table-cell;
margin:0;
padding:0;
}
</style>

<div id="outer">
<ul id="point">
<li class="first"><a href="LINK">MENU</a></li>
<li><a class="current"LINK">MENU</a></li>
<li><a href="LINK">MENU</a></li>
<li><a href="LINK">MENU</a></li>
<li><a href="LINK">MENU</a></li>
<li><a href="LINK">MENU</a></li>
</ul>
</div>


 Vá em Layout - Elementos da página - Adicionar um gadget = HTML/Javascript e cole.

Depois faça as modificações nas partes destacadas.

MENU - coloque um título para o menu (Ex. Inicio , Contato, e etc...)
LINK - coloque o link para o título. (Link de destino)

Para adicionar um novo menu, copie  a parte destacada de verde e cole abaixo dela mesmo.

Para alterar a cor do menu,  modifique as partes destacada de rosa por outra cor em HEXADECIMAL, clique qui para ve a lista de cores

Depois de ter modificado, Salve! e arraste o gadget para o topo da sua página.

Marcadores: , ,

0 Comentários:

Postar um comentário

Se você gostou deste artigo deixe um comentário!

Duvidas ou sugestões comentem aqui! =D
*Não insultar autor ou leitores da postagens
*Não pedir parceria por comentários
*Não publicar spam ou similar.

Assinar Postar comentários [Atom]

Links para esta postagem:

Criar um link

<< Página inicial