Seguidores

Pesquisar este blog

domingo, 17 de junho de 2012

0

Como fazer um menu !

Scaled_large
Oie Povo,eu estava vendo no blog Tutoriar e achei um Tutorial muito legal....

Sem Mouse:




Com Mouse:



Vai em Design > EditarHTML

Procure por:(Ctrl+F)

]]></b:skin>
Cole o código abaixo modificando-o , no própio menu já vem uma explicação:
ct {
font-family: century gothic; /* Fonte do Menu */
width: 10%; /* Tamanho do Menu */
float: left;
background:#FF82AB; /* Cor do fundo do Menu */
padding: 5px;
text-align: center;
margin: 2px;
-webkit-border-radius: 11px;
-webkit-border-top-left-radius: 1px;/* Efeito das bordas */
border-radius: 11px;
border-top-left-radius: 1px;
-webkit-transition-duration: .80s; /* efeito trasition */
font-size: 10pt; /* Tamanho da fonte */
color: #000; /* Cor da fonte */
}
ct:hover {
font-family: century gothic; /* Fonte do Menu quando passa o mouse */
width: 10%; /* Tamanho do Menu quando passa o mouse */
float: left;
background:#eee; /* Cor do fundo do Menu quando passa o mouse */
padding: 5px;
text-align: center;
margin: 2px;
-webkit-border-radius: 22px;
border-radius: 22px;
-webkit-transition-duration: .80s; /* efeito trasition */
font-size: 10pt; /* Tamanho da fonte do Menu quando passa o mouse */
font-style:bold; /* Fica em negrito quando passa o mouse */
color: #000; /* Cor da fonte do Menu quando passa o mouse */
}

 Agora para usar cole o código abaixo adcionando um gadget Html/JavaScript :
<a href="Link"><ct>Nome</ct></a>
<a href="Link"><ct>Nome</ct></a>
<a href="Link"><ct>Nome</ct></a>
<a href="Link"><ct>Nome</ct></a>
Onde esta de roxo é o link da página e onde esta de vermelho, é o nome da página .

Nenhum comentário:

LinkWithin

Related Posts Plugin for WordPress, Blogger...