Barra de rolagem colorida

Oi pessoas . Hoje vou postar o meu primeiro tutorial eeeeeeh rsrs! Ja havia perguntado a vocês qual tutorial deveria ser o primeiro aqui no Gn,poucos responderam mais ouve repetições então o escolhido é a barra de rolagem colorida .

Antes de tudo vamos dar os devidos créditos a Menina Nerd, que é um blog perfeito!
Então vamos começar:

1. Vá em designe, depois editar HTML, de um CTRL + F ou F3 e procure por :
]]></b:skin>
2. E antes dele cole:
*{
scrollbar-face-color:#FF69B4;
scrollbar-highlight-color:#FF69B4;
scrollbar-3dlight-color:#343434;
scrollbar-darkshadow-color:#343434;
scrollbar-shadow-color:#FF69B4;
scrollbar-arrow-color:#343434;
scrollbar-track-color:#343434;
}

::-webkit-scrollbar {width: 12px; height: 4px; background: #343434; }
::-webkit-scrollbar-thumb { background: #FF69B4; }
  OBS :Os códigos destacados em roxo representam a cor da barra, e os destacados em vermelho representa a cor de fundo. Se quiser, você pode mudar as cores, basta substituir os códigos destacados. Essa tabela tem várias cores. Não funciona no Firefox.

Espero que tenhãm gostado
 beijo beijo

37 comentários:

  1. Gostei do seu blog, as dicas ajudam bastante, te seguindo aqui tbm
    beijs

    http://agoraquesouchique.blogspot.com

    ResponderExcluir
  2. Ótimo tuto, só não uso por que muita gente entra pela IE e nele a cor da barra fica diferente...

    By trashysplash.blogspot.com

    ResponderExcluir
  3. A barra colorida é demais e dá outra aparencia ao blog, né? Eu adoro!

    jeito-inedito.blogspot.com (post novo)

    ResponderExcluir
  4. Ah gostei, eu ja tinha visto, mais esse ai ta diferente, a minha eu mexi deixei bem grossa kkk eu gosto assim tudo grande *----* acc afiliação/parceria.. não sei kk avisa tá? bjs http://ianapaulinhaaaa.blogspot.com/

    ResponderExcluir
  5. AÊ! O blog tá lindo, parabéns!!
    Tutorial mt bom =)))

    Bj,
    Naíra.

    http://blogdanaira.blogspot.com/

    ResponderExcluir
  6. OlÁ!
    Obrigada pela visita no meu blog e por seguir. Muito boas as dicas que li aqui no seu.
    Estou seguindo!
    Xêro!

    http://jacifoiodiscovoador.blogspot.com

    ResponderExcluir
  7. Oi
    Eu já conhecia esse tutorial ! Tenho a barra lá no meu blog também :) . Ótimo post .

    Beijos ;*


    www.atrevidass.blogspot.com

    ResponderExcluir
  8. adorei o tuto ja mudei a minha bjbj

    http://quasepuberdade.blogspot.com/

    ResponderExcluir
  9. muitoo lindoo o blog, maeii tudo aki, seguindooo
    segue de volta?
    http;//swett-girls.blogspot.com

    ResponderExcluir
  10. Oi! Gostei do visu do seu blog. O meu tá meiomeio, sabe? Tá no começo e não saco muito de mudar coisinhas nele. Sou nova nesse mundo blogger. rsrsrs.
    Vou adicionar o seu e ver se consigo fazer algumas coisas que vc ensina. Adiciona o meu de volta? Bjs;

    ResponderExcluir
  11. David gostei bastante rs do tutorial , muito útil ensina também a personalizar as citações , eu amei a sua , tem post novo comenta
    http://perfeitinha-blog.blogspot.com/

    ResponderExcluir
  12. Oi David !
    Adorei o seu blog também , ele é bem fofo e lindo.
    O tutorial eu já conhecia , mas valeu porque sempre que eu precisar volto aqui e pego *-*

    Obrigada pela visitinha no meu blog. Tem design e post novo , confere ? XOXO.
    http://garotaexigenteblog.blogspot.com/

    ResponderExcluir
  13. Retribuindo a visita! Adorei o blog! Era tudo o que eu precisava!

    #seguindo

    cdiasblog.blogspot.com

    ResponderExcluir
  14. Que mara hein adoei

    Beijo
    http://marifriend.blogspot.com/
    @Storiesandadvic

    ResponderExcluir
  15. oii, seguindo aqui, tudo lindééx por aqui!! amei amei amei.

    bjbj

    prettygirl-blogdagaby.blogspot.com

    ResponderExcluir
  16. Meu, eu acho super descolado. Eu só não personalizo o meu porque gosto da história podrinho sabe? ASASIJASIASJ. Mas enfim, é uma ótima dica.

    E meu, eu vou te mandar um e-mail em relação ao meu interesse em fazer parceria com o seu blog, que aliás, está de carinha nova: I LOVED. Então, conversamos por lá *-*

    Espero você no amigoperigo colegs *-*
    http://amigoperigo.blogspot.com

    ResponderExcluir
  17. fico feliz de todos vcs terem gostado do meu primeiro tutorial rsrs ! beeijos a todos e voltem sempre ;*

    ResponderExcluir
  18. Oi David, adorei seu blog e essa dica incrível! Já estou seguindo e obrigada pela visitinha no Frívolo, volte sempre ;)

    Bjs Frívolo Blog

    #SORTEIO
    http://frivollo.blogspot.com/2011/10/sorteio-saad-deixando-voce-seguidora-do.html

    ResponderExcluir
  19. Adorei o post incrível já coloquei no meu colorido, ahh to seguindo como:cntdobrasil!!! adorei seu blog. beijos

    byemilyferreira.blogspot.com

    ResponderExcluir
  20. aaamei o blog,estou seguindo!!!obrigada por seguir o meu!!!!

    http://spaceteen-chris.blogspot.com

    ResponderExcluir
  21. Obg a todos por comentareem ! vcs são muitoos bem vindos aqui !

    ResponderExcluir
  22. Ótimo tutorial !
    As barras de rolagem personalizadas dão um efeito melhor ao blog ^^

    http://happymomentts.blogspot.com/

    ResponderExcluir
  23. olá agora sim eu consegui te seguir adorei o tutorial.
    Te espero por lá viu.
    http://plantaodabeleza.blogspot.com/
    Beijosssss Simara

    ResponderExcluir
  24. Prontinho amei aqui e já estou seguindo *-*

    http://meninas-lindas-cdm.blogspot.com

    ResponderExcluir
  25. Oi David, já estou seguindo seu blog também. Obrigada por ter visitado o meu. Gostei muito daqui.
    um abraço
    Gisela - Ler para Divertir

    ResponderExcluir
  26. Affs eu não uso Google Cheronme ou internet explorer ¬¬ só uso firefox

    ResponderExcluir
  27. Obrigada pelo tutorial super interessante.
    Parabéns pelo blog

    ResponderExcluir
  28. Comigo não funcionou:(Mas legal o tutorial:)

    ResponderExcluir