Olá gente abençoada , obrigada pelo carinho de todos(a) vocês de ❤. Hoje resolvi dividir com vocês esse Menu que por sinal é muito fofo!!
Nível Fácil


Copie o código abaixo

.menu a { margin-right: 140px; background:#FFFFF0; /* Cor das caixinhas */ border-top: 2px dotted #FFB6C1; /* Borda */ font-family: Palatino linotype; /* Fonte */ font-style: italic; /* Estilo da fonte */ text-transform:capitalize; /* Estilo da fonte - uppercase: maísculas e lowercase: minúsculas */ display: block; /* Exibir em bloco */ font-size: 10pt; /* Tamanho da fonte */ color:#363636; /* Cor do texto */ padding: 3px; /* Margem interna */ text-align: left; /* Alinhamente do texto */ margin-bottom: 1px; } .menu a:hover { border-right: 6px solid #FF82AB; /* Borda em hover */ } |
-------------------------------------------------------------------------------------
Agora copie o código abaixo cole em HTML/Java Script e salve.
<table cellpadding="0" cellspacing="0" id="AutoNumber1" style=" background-image: url('http://i111.photobucket.com/albums/n159/docedani/acesstemp/backcg_/90.gif') /* Bakground de fundo */; border:1px dashed #FF1493 /* Cor da borda */"> <tbod><tr> <td align="left" width="100%"> <div style="margin-bottom: 0; margin-top: 0;"> <span style="color: #000000 /* Cor da font */; font-size:13;/* Tamanho da Font */" > <div class="menu"> <img src="http://i111.photobucket.com/albums/n159/docedani/imagem_menu/imagem02.png " align="right"/* Imagem do MENU */ /> <a href=" ENDEREÇO "><img src="http://i111.photobucket.com/albums/n159/docedani/imagem_caindo/25.gif" /> Link 01</a> <a hef=" ENDEREÇO "><img src="http://i111.photobucket.com/albums/n159/docedani/imagem_caindo/25.gif" /> Link 02</a> <a href=" ENDEREÇO "><img src="http://i111.photobucket.com/albums/n159/docedani/imagem_caindo/25.gif" /> Link 03</a> <a href=" ENDEREÇO "><img src="http://i111.photobucket.com/albums/n159/docedani/imagem_caindo/25.gif" /> Link 04</a> <a href= " ENDEREÇO "><img src="http://i111.photobucket.com/albums/n159/docedani/imagem_caindo/25.gif" /> Link 05</a> <a href=" ENDEREÇO "><img src="http://i111.photobucket.com/albums/n159/docedani/imagem_caindo/25.gif" /> Link 06</a> </span></div> </td></tr> </tbody></table> </div> |
Personalizei algumas Imagens que também podem ser usadas no Menu, para usa-las clic com o botão direito na sua preferida em seguida copiar endereço da imagem,
(na segunda tabela localize /* Imagem do MENU */ apague o endereço atual e cole o novo.
(na segunda tabela localize /* Imagem do MENU */ apague o endereço atual e cole o novo.





Faça uma copia de todo o seu HTML antes de fazer qualquer personalização no seu blog.
E por hoje é só desejo a todos uma otima semana.Jesus ama vocês!
Menu fica super fofo! :p:
ResponderExcluirBeijos,
Camila Angelina
http://cantinhodacaps.blogspot.com (agora com TEMPLATE ANIMADO)
Que legal que fica flor, achei super fofo! mas eu não mecho em Html, rs :b: beijoss
ResponderExcluirhttp://dezahoffmannmoda.blogspot.com.br
Adorei o tutorial, super útil e o resultado é lindo.
ResponderExcluirBeijos ♥
sweetasodile.blogspot.com
Adorei!! Fiquei muito feliz com sua visita ao meu blog! Amei o seu e estou seguindo *-*
ResponderExcluirBeijos
blogmodaonline.blogspot.com
Qui fofura de blog ^^ Muito sucesso ! Kisses flor http://candyyshine.blogspot.com.br/
ResponderExcluirOii ^^ há um tempo atrás eu até fiz um curso de Photoshop, mas, pela falta de prática, acabei esquecendo tudo... Só sei mexer mesmo no PhotoFiltre e no PhotoScape mesmo. Ah, e o gadget de seguidores tá lá no rodapé do blog, vai ver por isso você não encontrou (aliás, já tô seguindo aqui viu?)
ResponderExcluirbeijo!
Elfa do PhotoScape
Queria tanto aprender fazer isso ^^ mas nao entendo nada, nem com um super tutorial desses ^^
ResponderExcluirBeijos :*
http://sombraeblushmakeup.blogspot.com.br
Vou tentar colocar!!
ResponderExcluirBjinhos
Mayara Lopes
www.pensaseeufosserica.com
Tutorial , facil e útil :f:
ResponderExcluire no fim resultado e lindoo
*********************************************
http://blog-meninasmalucas.blogspot.com.br/
*********************************************
Acabou de sair um post quentinho ! Vamos la ver ?
Oi, estive passando por aqui e adorei o blog, é tudo muito lindo por aqui, estou seguindo.
ResponderExcluirQuando puder, de uma passadinha no Papeando com Gabi.
beijos
beijos
Que coisa mais linda esse blog! *-*
ResponderExcluirCom certeza já estou seguindo.
E quanto as minhas unhas, também cortei logo que a minha sobrinha nasceu, mas como ela já ta crescidinha, eu deixei elas crescerem de novo =)
Beijão!
http://esmaltesetudo.blogspot.com.br/
Muito bom o post, adorei o blog! Seguindo...
ResponderExcluirte convido a participar do sorteio que ta rolando no meu blog, um super kit para os cabelos! bjos, Juliana
http://praquemamacabelo.blogspot.com.br/2012/07/1-sorteio-em-parceria-com-nectar-do.html
Complexo, ainda me perco nesse monte de letrinhas :/
ResponderExcluirMas tá super bem explicadinho, eu é que sou preguiçosa kaspopkapsopkas
Tô te seguindo, se puder segue meu blog tbm?
http://lasgarras.blogspot.com.br/
Beijos!
Adoro esse menu, meu proximo lay vai ser com ele ^^
ResponderExcluirAdorei o seu blog. Tudo super bem elaborado, organizado e lindo.
Eu estou seguindo, se gostar do meu, retribui? Irei ADORAR te ver em meu cantinho ^^
Ah e, gostaria de te pedir um favor, se num for te incomodar, claro. Afinal, num quero atrapalhar a vida de nenhuma blogueira (já atrapalhando #HAHAHA)
Poderia votar em mim, aqui:
http://garotadifferente.blogspot.com.br/
Beijos.
Diário de uma Garota
Adorei o tutorial, flor.
ResponderExcluirBjinhOos
@SanRodriguesS2
Fanpage blog:http://www.facebook.com/blogsanrodriguess2
http://www.sanrodriguess2.blogspot.com/
Amei o Blog! Parabéns! Se aceitar afiliação é só avisar ok :)
ResponderExcluirBeijoos
♥ Sempre Linda ♥
http://alwaysbeautif.blogspot.com.br/
Oie! Muito meigo o seu blog! Amei.
ResponderExcluirJá estou seguindo tbm!
Beijos
http://belezasemalergia.blogspot.com.br
Olha eu aqui de novo :)
ResponderExcluirRs' oi flor, eu respondi seu comentário em meu Blog, gostaria que você desse uma olhadinha para tudo ficar esclarecido ta :)
Ah, eu li seus termos para afiliação, por mim está tudo certo! Se estiver tudo certo para você também, é só me avisar, ok?!
Beijooos
http://alwaysbeautif.blogspot.com.br
:b: esse menu fica lindo! e o tutorial é bem facinho gostei! obrigada por seguir meu cantinho! mega seguindo aqui, parabens pelo blog.
ResponderExcluirhttp://kelly-club.blogspot.com.br/
Oi Dani! Já está como afiliada também! Beijão :)
ResponderExcluirÓtimo tuto, pode ensinar como deixou a área de post com background do lado esquerdo? Obrigada ;)
ResponderExcluirAfiliação?
Beijos♥
carismaticaoficial.blogspot.com
Ounwtt seu blog é uma gracinha*-*bjos
ResponderExcluirhttp://www.explodindoglamour.blogspot.com.br/
ameei esse blog , me segui to seguindo garotaestranha25.blogspot.coom
ResponderExcluirbjbj'
oi dany vim agradecer a sua visitnha.
ResponderExcluirobrigado por me segiur.
seguindo aqui também.
adorei o tutorial;
bjuhs
http://quecorusar.blogspot.com.br
Obrigada por passar no meu blog, to seguindo aqui.
ResponderExcluirhttp://www.blogjustmy.blogspot.com.br/
hey amr amei o blog seguindo aqui segue o meu? thanks otima sexta xoxo http://fastfashionpink.blogspot.com.br/
ResponderExcluirNossa deve ficar lindo mesmo. Adorei o tutorial, está de parabens.
ResponderExcluirSeu blog é muito fofo ^^
SUPER BEIJO
Participe dos quadros do meu blog == > http://semcontrole.net.tc
Adorei essa dica de personalização no blog.
ResponderExcluirBeijos.
www.deliriosdeconsumista.com.br
Olà linda, seu blog é D+
ResponderExcluirLindo e interessante
Gosto muuuuiiiito!!!
Bjuuuusss
Cris
Crescimento Cristão
Fan Page Cristãos em Construção
Amei o seu blog! Obrigada pela visita em meu blog.Gostei dos tutoriais. Beijo, Lylian
ResponderExcluirMuito Legal esse tuto Dany, como sempre fazendo um ótimo trabalho, super bem explicadinho :)
ResponderExcluirhttp://cantinhodaamah.blogspot.com.br/
Interessante!
ResponderExcluirCom certeza ajudou muita gente!
http://docebunny.blogspot.com.br/