![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjT6r08dLBIwYR-HFFZgByDY7SychVyNlNvKZpCBQTwnG7kLpaXRuLZvkCkR82L-jzEc3ShtY-iugzjCWMOsWZjVjP5QedfmpYoo9L29HOb0aYyY6MfmPxW18m29R90eyR3LbNClbNRyzzy/s1600/post.png)
Olá!
Faz um bom tempo desde o último tutorial, mas fico muito feliz em sempre receber comentários/e-mails sobre o Seja Criativo e também vários pedidos de tutoriais. Estou tentando terminar de preparar todos os que vocês pedira. então teremos alguns atualizações por aqui.
O tutorial de hoje é bem simples, porém algumas pessoas não conhecem a estrutura e para facilitar preferem buscar menus prontos na Web, o que nem sempre nos deixa personalizar como queremos de verdade. Como já disse: é simples e fácil de aprender!
Primeiro: A estrutura
A forma mais comum de criar um menu é usando listas não ordenadas (ul, li). Para quem não conhece sobre listas, o site Maujor já fez um tutorial fácil e curtinho!Enfim.
O HTML você poderá escolher onde vai ser acrescentado. Tudo depende de onde você quer que o menu apareça, basta escolher o local após <body>.
Segundo: O CSS
Esta parte deve ser acrescentada antes da linhas ]]></b:skin>.Após adicionar o CSS, o menu deverá ficar desta forma:
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTriuT7DhOG8FnN9av3WLA8FbCW2uNnhVibR3RNXxmk5BSqXuT-YvZQfQXoQMbJ5HwdAcUIGBFwtw5LXr4p52hyphenhyphenzWxdk50RbMRpSVHoDnvkJbFN59aOrEibBozBuqb91qHWKnkmb4P2tJ8/s1600/menu.png)
E quem quiser conferir, separei alguns links que você pode usar como base para personalizar o seu menu:
- Menu em CSS - Menu dropdown horizontal com HTML5 e CSS3
- Easy HTML 5 & CSS 3 Navigation Menu
- 46 Menus suspensos criativos e livres em HTML5 e CSS3
- Cloud Ice Blue Demo - HTML5 menu example
Fácil não é?
Se você tiver qualquer dúvida ou quiser outro tutorial aqui no Seja Criativo, basta deixar um comentário ou entrar na página de contato do blog.
Gente, leu meus pensamentos, Mi *-* Tava querendo um menu diferente.. mamão com açucar <3 Obrigada por disponibilizar
ResponderExcluirPor nada, flor! ^^
ExcluirBeijos
Este comentário foi removido pelo autor.
ResponderExcluiramei, vou testa com certeza! posso dar dicas de tuturial?
ResponderExcluircaixa de pesquisa como a do blog www.followyourdreams.com.br
diponibiliza icons redes sociais aquarela como os teus do dezoito primaveras
marcadores em lista (2 colunas)
footer dos posts igual do meios dias gastos
data personalizada
ah, sabe o q ia ser mto show? um lay free só pra base mesmo, p quem quer editar.
essas são minhas dicas, ficarei feliz se aceitar
bjbj, babi
Poxa venho aqui td dia e nunca tem nada ! :(
ResponderExcluirOie dica de tutorial ? menu responsivo ! pó de ser ? próximo post
ResponderExcluirNo me sirvió :/
ResponderExcluir