27 de agosto de 2012

Desculpas + Menu horizontal hover

Oi meninas, me desculpa por não ter postado durante esses dias, mas a titia Tory, estava sem net. Pois é, os retardado da Corsan, aqui do meu bairro cortaram o fio da internet sem querer. Então palmas para eles!! Pois é eu quase morri, fiquei 4 dias sem internet. Bom o tutorial de hoje é bem simples, é um menu super fofo:
Foto do Cherry Bomb

Entre na sua conta Blogger, em seguida vai em: Layout > Adicionar Gadget > HTML / JavaScript
no espaço em branco cole o seguinte código:

<STYLE type="text/css">
#menuzinho {
display: block;
width: 100%;
height: 19px; /* ALTURA DO MENU /*
width:178px /* LARGURA DO MENU /*
vertical-align: middle;
font-family: Verdana, Arial, sans-serif;
font-size: 10px; /* TAMANHO DA FONTE */
font-weight: bold;
color: #FFB3D7; /* COR DA FONTE */
text-indent: 5px;
line-height: 17px;
margin-bottom: 3px;
margin-left: -1px;
background-color:#FFECF3; /* COR DO FUNDO */
}
#menuzinho:hover {
display: block;
color: #FF80C0; /* COR DA LETRA QUANDO PASSA O MOUSE */
background-color: #FFDFEE; /* COR DO FUNDO QUANDO PASSA O MOUSE */
}
</style>
<a id="menuzinho" href="URLDOLINK">NOME DO LINK DO SEU MENU</a>
<a id="menuzinho" href="URLDOLINK">NOME DO LINK DO SEU MENU</a>
<a id="menuzinho" href="URLDOLINK">NOME DO LINK DO SEU MENU</a>
<a id="menuzinho" href="URLDOLINK">NOME DO LINK DO SEU MENU</a>

O código já tá explicado pela Liah, do Cherry Bomb, créditos ao Cherry Bomb!
Para mudar as cores, está explicado onde é onde ok? Para mudar use essa tabela. E se você quiser por exemplo colocar mais páginas, ali no código tem apenas 4, para colocar mais cole esse código, abaixo do menuzinho:


<a id="menuzinho" href="URLDOLINK">NOME DO LINK DO SEU MENU</a>

3 comentários:

  1. Ótimo tutorial *-* Vou usar em alguns blogs meu...
    Bjos ◑ω◐

    ResponderExcluir

Comente a vontade, desde que saiba respeitar ;)
Ah, e não é necessário fazer uma conta para comentar, basta colocar como anônimo.

Emoticons:

♥❤∞ ☆ ★ ✖ 。◕‿◕。® ™ ☏✿゚✤
(◕‿◕✿) 。◕‿◕。 ⊱✿◕‿◕✿⊰(◡‿◡✿)(◕〝◕)◑▂◐ ◑0◐ ◑︿◐ ◑ω◐ ◑﹏◐ ◑△◐ ◑▽◐
●▂● ●0● ●︿● ●ω● ●﹏● ●△● ●▽●
⊙▂⊙ ⊙0⊙ ⊙︿⊙ ⊙ω⊙ ⊙﹏⊙ ⊙△⊙
≡(▔﹏▔)≡ ( ͡° ͜ʖ ͡°)