Sejam bem vindos meu ao bloguinho, ele foi criado com o intuito de ensinar a quem necessita de ajuda em html e css, temos diversos tutoriais e materiais. Fiquem bem a vontade e qualquer dúvida que tiverem entrem em contato comigo ou peçam pela ask. Beijinhos caramelados e inté mais ♡
Search here
All that you want is here, css and html
Welcome to garota no mundo html.
- efeito legenda nas imagens de posts
- backgrounds grandes em aquarela
- Avatar do autor no post footer
- Leia mais na mesma linha do header
- Efeito Dragqueen e efeito Swing
- Três modelos de menus agenda
- Usando temas de tumblr no blog
- Criando seu próprio modelo de data
O tema atual do layout é: the fall of leafs
A meta dos posts do blog é de: 300 posts
A meta de comentários do blog é de: 3500
O blog foi inaugurado no dia: 27/12/2012
os Seguidores do blog atualmente são: 865
A versão atual do layout está na: 41ª vers.
folhinhas que estão no blog online agora:
folhinhas que já passaram por aqui:

Menu simples para o topo


Sate sate minasan? To tão cansada T^T Mas estou aqui postando para vocês, me desculpem pela demora mas estava adiantando algumas coisas pois fim de semana pra mim é sempre um pouco complicado estar 100% na net. Então, estava testando alguns menus e editando para ver qual ficava melhor no tema de teste, duas leitoras me pediram para postar um menu e que fosse igual ao meu, só que quem me conhece sabe que não posto nada dos meus layouts atuais. É uma regra bem velhinha já, para quem ainda não sabia se ler todo o post já sabe certo? Sei que muitos me acham chata por isso mas sou assim e não irei mudar, muitos tem que me agradecer pois assim não ficam com aquela mania besta de todo mundo ficar copiando e usando as mesmas coisas dos layouts dos outros. Lembrem que a merda do plágio começa por ai, inspiração é uma coisa mas cópia já é outra!!

Mas então amores, eu uso esse menu ali no topo uns 3 layouts seguidos, a única coisa que mudo é cores efeito hover e as fontes. Me pediram igual, como não irei postar o mesmo eu criei um meio parecido mas com o efeito hover bem diferente, tipo eu amo menus assim para o topo pois deixam o layout mais clean e não tão pesado, deve ser por isso que não consigo mudar de modelo a 3 layout atrás. Bem eu achei ele bem fofo mas como sou bem insegura pedi opinião para 3 pessoas conhecidas, elas gostaram e me deixaram mais tranquila para postar. Poderia fazer mais de um modelo mas se tem algo que odeio é mostrar eles em imagens e não em live preview, só que geralmente só cabe um menu no topo não é mesmo? Bem, espero que gostem e que usem, é comum mas é bem fofo, só precisam mudar as cores e sombra de texto pois o resto deixem como está ok? Kissus e até mais ~


LIVE PREVIEW —/♥—

Fonte usada: Abeezee

Se quiser usar cole o código abaixo de <head>
<link href='http://fonts.googleapis.com/css?family=ABeeZee' rel='stylesheet' type='text/css'/>

Código para o Html:
.topo1 {font-family: 'ABeeZee', sans-serif; color:#B73F4D; font-size:12px; text-transform: lowercase;padding-top:-20px;padding-left:10px;padding-right:10px;padding-bottom:-20px;-webkit-transition: all 1.7s ease-out;text-shadow: 1px 1px 1px #fff;}
.topo1 a {font-family: 'ABeeZee', sans-serif; color:#B73F4D; font-size:12px;1px 1px 1px #fff;text-decoration:none;-webkit-transition: all 1.7s ease-out;}
.topo1:hover{font-family: 'ABeeZee', sans-serif; color:#fff; font-size:12px;text-align:center;background: rgba(255, 255, 255, 0.5);padding-top:5px;-webkit-transition: all 1.5s ease-out;padding-bottom:5px;color:#FFA7B1;text-shadow: 0px 1px 0px #fff;text-decoration: line-through;border-radius:5px;-webkit-transition: all 1.7s ease-out;}
Link para os gadgets:
<div style="position: absolute; margin-top: -30px; left:80px;">
<a href="/" class="topo1">nome</a>
<a href="/" class="topo1">nome</a>
<a href="/" class="topo1">nome</a>
<a href="/" class="topo1">nome</a>
<a href="/" class="topo1">nome</a>
<a href="/" class="topo1">nome</a>
<a href="/" class="topo1">nome</a>
<a href="/" class="topo1">nome</a>
<a href="/" class="topo1">nome</a>
<a href="/" class="topo1">nome</a>
</div>
Mude os valores para ajeitar o menu ao seu gosto no tema, mude o valor do margin-top e margin-left até deixar um valor que fique correto no topo certo? Se quiser pode diminuir os links e deixar a quantidade que quiser ^-^


41 comentários:

  1. Esse menu é tão meigo ♥
    Menus no topo deixam tudo bem clean mesmo, mas eu nunca acho um bonito, sempre encontro um com caixa de busca (e muitas vezes essas caixas de buscas são horríveis - _ -). Gostei muito, quem sabe eu use.

    Xoxo || Once Upon a Time

    ResponderExcluir
    Respostas
    1. Nhawww obrigada >.<

      Sim também gosto de menus assim, e sim, ficam bem melhores por serem mais clean. Sim se quiser usar fique a vontade ;)

      Kissus ~

      Excluir
  2. Eu já disse que esse menu tá lindo neh? É eu já disse, mas não custa dizer novamente ahusas' Está muito lindo, cute esse menu, dá próxima vez que eu trocar o layout devo usa-lo u.u E essa fonte é tão fofa ^3^

    Diamond Resources

    ResponderExcluir
    Respostas
    1. UHASUAHSuahs Obrigada >.< sim use que irá ficar bem legal, imagina ele em tons de azul ou verdinho *o* Sim amo esta fonte tbm >.<

      Excluir
  3. Nyaaan, o menu é muito fofo ♥♥
    Concordo com você, fique com essa regra velhinha para sempre senão vai vir treta pra tudo quanto é lado ;-;

    Chu, http://burucheri.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Obrigada amore >.< Sim faz tempo que tenho ela no blog e não irei mudar!

      Excluir
  4. gostei tanto do menu pena que eu já fiz o novo layout , fica na próxima cristalizei.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Nhaww obrigada ^^ Sim use no próximo afinal sempre estamos mudando de layouts né? >.<

      Excluir
  5. Eu to apaixonada por esse menu, vou usa-lo com certeza no meu próximo lay, amei.

    Beijos <3
    p-perfectsthings.blogspot.com.br

    ResponderExcluir
  6. Que lindo o menu <3 Amei , super fofo , talvez no meu novo layout irei usa-lo :3

    bjs *u*
    http://byalinebeatriz.blogspot.com/

    ResponderExcluir
    Respostas
    1. Obrigada, óia óia espero que usem mesmo HSAHSUAHSUAHS Beijão =3

      Excluir
  7. Amei!!!Pior que é verdade,o plagio sempre começa com um pequeno descuido que damos.
    Beijos
    diario-de-uma-adolencencia.blogspot.com

    ResponderExcluir
    Respostas
    1. Sim, sempre começa assim então o recado está dado u.u Beijos =3

      Excluir
  8. Amei o menu :3
    Mas o HTML do menu se poe abaixo do head também?

    ResponderExcluir
    Respostas
    1. Obrigada ^^, o menu tem que por acima de ]]skin; amore ;)

      Excluir
  9. entendo Roh alem de cansada tambem to sem tempo auahsuas
    voce ta certa mesmo , esse tipo de inspiração tem que se cortar pela raiz porque quando vai ver olha lá tudo plagiado q ..
    como já havia dito o menu está lindo ;3 assim como todos os seus tutos ..
    ( to tentando comentar a um tempão , mas a internet sempre cai .;..)

    Beijos , @G²!

    ResponderExcluir
    Respostas
    1. Awwww obrigada linda >.< Não se preocupe pois eu também não sou de comentar frequentemente então nem precisa de desculpar ou algo do tipo viu? beijocas linda =3

      Excluir
  10. Nhaa, que menu fofo *u* deve ser chato ter que ficar explicando pro povo o porquê de você não postar coisas do layout atual -.-
    Cansada eu não estou, to de férias ~tia, tem que lembrar que só tem criança aqui~ só durmo, como e leio. Bjos, vida boa u3u

    Royalty

    ResponderExcluir
    Respostas
    1. Obrigada ^^ Pois é, é muito chato cara T^T mas quem me conhece já sabe >.< Que delícia de férias hein?? Beijos =3

      Excluir
  11. Que menu lindou >3< (gostei mto tbm do leia mais do blog de teste) se tem um coisa que eu não suporto é plagio, sério, até desanima de continuar blogando!

    below average ✌

    ResponderExcluir
    Respostas
    1. Obrigada amore :3 é o mesmo que postei aqui no post anterior >.< Quem suporta plágio né? Acho que ninguém ¬¬

      Excluir
  12. Yoo ^-^ Você tá certa em não disponibilizar nada do seu layout atual, aliás, exclusividade é tudo! >.<

    O menu é uma fofura, sério... Quase tão perfeito quanto o daqui - eu disse quase. HUASUHAUSH E é bem facinho <3

    Beijos ♥ || Empire Kawaii ~ Quinze Outonos

    ResponderExcluir
    Respostas
    1. Sim né? Que bom que concorda comigo >.< pois muitos me acham chata por causa disso UASHUASHUAHSs u.u sou mesmo! Obrigada, sim amo menus assim também assim como o meu bem simples ;) Beijos =3

      Excluir
  13. Adorei o menu, é uma fofura e muito lindo ! *W* <3
    Adoro tudo deste blog, gssuis ♥
    Kissus ~
    http://s-alad.blogspot.com.br/ <-- Aguardo sua visita <3

    ResponderExcluir
  14. Nha, que lindo >w<

    Você está certa em não ficar disponibilizando coisas do seu layout pra outros blogs, vai ter muito plagio se fizer isso e-e.

    i-cemoon.blogspot.com.br

    ResponderExcluir
    Respostas
    1. Pois é comecei isso a algum tempo atrás e estou bem feliz pois uso minhas coisas e ninguém mais tem u.u Beijocas =3

      Excluir
  15. OI , até que gostei do menu , só não o colocarei ... porque decidi que quero maior parte do novo layout do blog com minha autoria Realmente passei para visitar , meus Blogrolls , pois seu blog esta nele como uns dos meus preferidos , repaginei o blog novamentte ( mais com a mesma URL ) , me diz oque achou ! . , Aguardo respostas *-*

    bjs www.candyedream.blogspot.com

    ResponderExcluir
    Respostas
    1. Ahhh que isso amor, tens toda razão de querer usar coisas só suas, eu mesma sempre faço assim acho mais original, não que os outros que usam materiais e tutos de outros blogs não sejam, mas acho que o dono ter suas próprias dá um ar de originalidade >.< Bem irei ver sim e dar minha opinião <3

      Excluir
  16. otimo tutorial, ainda mais que amo menus simples *--* pra mim são mais fofos e mais bonitos hehe

    estou vindo avisar a todos os nossos antigos afiliados que nos retornamos, resolvi mudar nome e url do blog, se quiser divulgar em algum post nosso retorno estaremos agradecidos - Antigo Kawaii Things || Just Some Things ( new url ) http://j-somethings.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Nhawwww obrigada amore *o* Obaaaa irei mudar a url da elite então amore, estou bem feliz que voltou pois sempre admirei muito o blog de vocês >.< Ire lá conferir tudo ;)

      Excluir
  17. Roh mulier,
    Adorei seu menu divo e o tutorial é espetacular
    Pergunta Básica: eu li ali em baixo acho que seria as regras para comentar e talz ainda tem vaga para novos afiliados??
    Olha eu não estou sendo chata (espero) mas seria uma honra se você segui-se o meu blog não te obrigando mas se você quiser né?

    Beijos || www.rilakkumaworld.tk

    ResponderExcluir
    Respostas
    1. Awnnn obrigada linda fico bem feliz que tenha gostado >.< Ahh amore que pena eu já estou com a elite cheia mas quando abrir uma vaguinha eu te coloco ok? Bem irei dar uma passadinha lá e se der eu sigo sim ^^

      Excluir
  18. Perfeito, porém quando eu coloquei minha faixinha, o menu ficou abaixo, como arrumo isso? :/

    SEU BLOG É PERFEITO, SCR MAINHAAAAAAA ♥

    ResponderExcluir

Olá meus amores, os comentários devem ser direcionados somente ao blog e não a vida pessoal de ninguém! Qualquer dúvida peça pela Ask que responderei o mais rápido possível. Anônimo não adianta vir xingar pelos comentários que antes de mesmo de pensar em me ofender eles serão excluídos! Não gosto de tags, se quiser fazer fique a vontade mas não irei retribuir, não curto seguindo segue de volta =/ mas posso seguir se gostar realmente do blog, não julgo por layout ou por seguidores, avalio o blog e como disse se eu curtir é claro que sigo, afiliações? Peça nos comentários pois se pedir em outro lugar no caso páginas é bem provável que eu não veja! Então meus lindos espero que curtam cada cantinho do meu bloguinho e voltem sempre! kissus (*^3^)