Menu Lolly - Exclusivo.

Olá pessoal, tudo bem com vocês? Comigo sim >3< A partir de hoje todas essas sumidinhas minhas já vão acabar, minhas provas já acabaram. Na verdade não ainda tem um simulado, porém não estudo pra ele. Me pediram pra fazer um modelinho de player, eu vou fazer mas é que a dona dele a Roh ainda não me autorizou ,então decidi atender logo á um pedido que me fizeram na ask que foi o menu lolly que eu adorei, espero que também gostem *u*


Modelo 01 .
Sobre o menu : Esse menu não tem nenhum tipo de hover ele é apenas assim, tentei fazer com que ele ficasse fofo e simples como pediram. Esse tom cinza na fonte poderá ser mudado quando você personalizar os links do blog pelo html. Logo abaixo você verá o código.
  .lolly {
font-family: Verdana; /* fonte */
font-size: 10px; /* tamanho da fonte */
background: #D4CDDB;
text-align: center; /* centralização do texto */
width: 46px; /* largura do menu */
color: #fff;
text-shadow: 1px 1px 0 #fff;
border: #c7d4df 1px solid;
display: inline-block;
box-shadow: inset 1px 1px 0 #fff;
background: #d0dbe4;
background: -moz-linear-gradient(top,  #d0dbe4 0%, #e8edf2 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d0dbe4), color-stop(100%,#e8edf2));
background: -webkit-linear-gradient(top,  #d0dbe4 0%,#e8edf2 100%);
background: -o-linear-gradient(top,  #d0dbe4 0%,#e8edf2 100%);
background: -ms-linear-gradient(top,  #d0dbe4 0%,#e8edf2 100%);
background: linear-gradient(to bottom,  #d0dbe4 0%,#e8edf2 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d0dbe4', endColorstr='#e8edf2',GradientType=0 );
}
border: 1px dotted #e4c9e2;
border-bottom: 2px dotted #d0dbe4;
padding: 2px; */
margin: 2px;
}


Modelo 02 .

 Esse modelo é igualzinho ao primeiro eu só mudei as cores, também não tem hover.

.lolly {
font-family: Verdana; /* fonte */
font-size: 10px; /* tamanho da fonte */
background: #D4CDDB; 
text-align: center; /* centralização do texto */
width: 46px; /* largura do menu */
color: #fff;
text-shadow: 1px 1px 0 #fff;
border: #c7d4df 1px solid;
display: inline-block;
box-shadow: inset 1px 1px 0 #fff;
color: #fff;
border: #ded6dd 1px solid;
box-shadow: inset 1px 1px 0 #f7f4f6;
background: #e8e1e7;
background: -moz-linear-gradient(top,  #e8e1e7 0%, #f4eff3 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e8e1e7), color-stop(100%,#f4eff3));
background: -webkit-linear-gradient(top,  #e8e1e7 0%,#f4eff3 100%);
background: -o-linear-gradient(top,  #e8e1e7 0%,#f4eff3 100%);
background: -ms-linear-gradient(top,  #e8e1e7 0%,#f4eff3 100%);
background: linear-gradient(to bottom,  #e8e1e7 0%,#f4eff3 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8e1e7', endColorstr='#f4eff3',GradientType=0 );
}
border: 1px dotted #e4c9e2;
border-bottom: 2px dotted #d0dbe4; 
padding: 2px; */
margin: 2px; 
}
Depois coloquem esse código abaixo em um html/javascript

<div class="lolly"><a href="LINK DA PÁGINA">menu</a></div>

<div class="lolly"><a href="LINK DA PÁGINA">lolly</a></div>

<div class="lolly"><a href="LINK DA PÁGINA">por</a></div>

<div class="lolly"><a href="LINK DA PÁGINA">anny</a></div>

* Não é possível usar os dois modelos de uma vez em um layout *
Créditos a Mack pelos gradients que eu utilizei >3<

55 comentários:

  1. adorei!!bj
    http://distractionsofaagirl-oficial.blogspot.com.br/

    ResponderExcluir
  2. Eba sumidinhas vão acabar ( e vamos ver a anna com mais frequência :) ( que menu mais divoso vou usar no layout que estou fazendo

    http://seaofdreamspink.blogspot.com.br

    ResponderExcluir
  3. Que fofinho, adorei.
    ~Abraços!

    -- barbieseumundopink.blogspot.com --

    ResponderExcluir
  4. Adorei o menu, muito fofo *W*
    Kissus
    Mellifluous ~ s-alad.blogspot.com.br

    ResponderExcluir
  5. Nossa que fofos ! Amei.

    Black Sawn || Espero sua visita !

    ResponderExcluir
  6. Que menu lindo acho que vou usar no próximo layout. Nossa seu blog é super fofo , adorei.

    ResponderExcluir
  7. Que fofura.. Também estou bem ausente aqui... Saudades u.u
    Beijos | Brigadeiro Vintage & Fairy Of Html

    ResponderExcluir
  8. Que fofo! (>-<)
    Aceita filiação ?
    http://b-kswan.blogspot.com.br/

    ResponderExcluir
  9. Minhas provas tbm acabaram \õ e hoje vai ter o boletim ai socorro kkk mas ainda bem que as sumidas vão acabar iruh -
    Amei esse menu, apesar de simples, bem fofo e facil a aplicação *---*

    bjs
    || editionskaty.blogspot.com.br ||

    ResponderExcluir
    Respostas
    1. Que bom ^3^ Meu deus eu ficaria morrendo de medo sadlçjfmnalsdjfasdf Obrigada!

      Excluir
  10. Olá! Comigo tudo bem sim <3 Finalmente chega de saidinhas, não é? >.<
    Adorei o menu, ele é simples e fofo, como eu gosto ♥ Parabéns!

    Kissus ~~♥ || Empire Kawaii

    ResponderExcluir
  11. Fico feliz que suas provas tenham acabado e espero que tenha ido bem.
    O menu é muito bonito.

    ResponderExcluir
  12. Realmente, mesmo sem hover,ele é muito fofo♥
    Amando a música do player ♥

    Cute Leeh || Esperamos sua visita ♥

    ResponderExcluir
    Respostas
    1. Sério mesmo? É que eu queria ele bem simples.
      Obrigada haha!

      Excluir
  13. As minhas vão começar ;-;. Lindo menu tia >3<


    We♥Asia | (ノ◕ヮ◕)ノ*:・゚✧www.wh-asia.net

    ResponderExcluir
  14. Que menu lindo! Ficou uma gracinha ♥
    E que bom que suas provas já acabaram, as minhas vão começar semana que vem ;-; sem or -q

    http://maiira-t.blogspot.com.br/

    ResponderExcluir
  15. É tão bom quando acaba as provas! Eu me sinto menos preocupado e livre, enfim, Espero que você tenha tirado notas legais :3 Achei o menu muito lindo.
    Beijos!
    novo blog: f-ancy.blogspot.com.br

    ResponderExcluir
  16. - Own ficou bem fofo *---* , ja imaginei ele na cor rosa ( ROSASTICA kk EU ) .

    www.candyedream.blogspot.com

    ResponderExcluir
  17. Semana de provas é horrível, amei o tutorial e seu blog é muito fofo <33
    Beijão
    FW ~ ☆

    ResponderExcluir
  18. É um menu super fofo, gostei dele! É simples e objetivo, pode-se usar de varias formas, iria ficar legal nos afilados também, eu acho! XD

    Beijinhos, Milky.

    bunny--days.blogspot.com

    ResponderExcluir
    Respostas
    1. Anw, muito obrigada! Sim também é uma ótima ideia >3<

      Excluir
  19. Oinwwwww que menus fofos gente *o*, amor eu autorizo sim afinal o modelo do player que tinha no meu blog nem era de autoria minha e sim de um tumblr, aliás postei o link do tuto do mesmo player lá na ask ;)

    ResponderExcluir
  20. Minhas provas começam amanhã,o bom e que é geografia,eu sempre me saio bem nessa matéria.O meu ficou muito fofo (⌒▽⌒)☆Things of Kawaii

    ResponderExcluir
    Respostas
    1. Vish, boa sorte. Eu também sou muito boa em geografia >3<

      Excluir
  21. Adorei o tutorial <3
    Amei seu Blog, já estou seguindo <3

    Beijos || chocolateequentelarii.blogspot.com ♥

    ResponderExcluir
  22. Espero que acabem mesmo u.u
    Graças a Deus que acabaram pois eu não estava aguentando mais tantas provas ;p. Graças ao meu bom Senhor essa é última semana de aula, então, oremos ashaushah. Os modelos estão lindos, assim como tudo nesse blog <333
    xo ♥ | http://unicornl4nd.blogspot.com.br/

    ResponderExcluir
  23. Que menu tão fofo >u< E o blog mais fofo ainda.

    Beijos, http://spring-flowe.blogspot.com.br/

    ResponderExcluir
  24. Que fofo ç3ç seria lindo também um modelo rosinha ^^

    Royalty

    ResponderExcluir
  25. Minhas provas acabaram, mas vem mais por aí :/
    Awn, que menu mais fofinho, amei o modelo lilás :3

    ~kiss
    CS ♥

    ResponderExcluir
  26. Que menu lindinho adorei *u*
    bjs ~~

    laserquestt.blogspot.com

    ResponderExcluir
  27. Ah, que sortuda! Ainda ou fazer provas na outra semana e dia 7 de julho vou fazer recuperação de física/matemática... pois é...
    Adorei o modelinho! Já fiquei imaginando ele num próximo lay.
    kissus~♥ ~ da IsabellaTwifan do || recantodafadaalice.blogspot.com
    P.S. amo a música que toca quando abre o blog. É de algum Vocaloid?

    ResponderExcluir

Qualquer dúvida comente no post mais recente ou pela ask.
Aceito criticas, mas construtivas.
Não use palavrões.
Comente algo relacionado ao post, todo blogueiro gosta de ler um comentário assim.