Line Scrollbar


Oie...hoje trouxe uma outra forma de personalizar a scrollbar/barra de rolagem do blog, lembrando que: funciona no navegador Chrome; pude aprender como fazer graças à HeyKiim; e que já mostrei outras formas de se personalizar a barra de rolagem, vejam em - 5 Mini tutoriais rápidos, fáceis e básicos - Scrollbar personalizada em qualquer navegador com Jscrollpane - Scrollbar padrão fofa.
Essa de hoje é a que estou usando atualmente no blog; trata-se de uma scrollbar discreta, em forma de linha:
Para fazê-la é bem fácil...
Basta ir em Modelo - Editar HTML - procurar por ]]></b:skin> e colar acima disto o seguinte código:

::-webkit-scrollbar-track-piece{
background: #fccaca; /**cor da linha**/
border: 2px solid #ffffff;
}
::-webkit-scrollbar{
width: 5px;
height: 5px;
}
::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment{
height: 20px;
display:block;
background:#ffffff;
border: 2px solid #ffffff;
border-bottom:0px solid #ffffff;
border-top:0px solid #ffffff;
}
::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal{
background:#fcc; /**cor da scrollbar**/
border: 1px solid #ffffff;
}

Onde estiver escrito background é que seria o ideal para alterar o código das cores; as demais se referem às bordas, width e height são largura e altura. Visualize e salve.
Espero que gostem e beijus ;3

5 Comments

  1. Ana03 junho

    Vou modificar agora mesmo a minha scrollbar, estava precisando desse tutorial! ^^

    sempre-divando.blogspot.com

    ResponderExcluir
  2. wangxian aus03 junho

    Gostei,estou aprendendo a usar o HTML agora e isso vai me ajudar bastante :3

    ResponderExcluir
  3. Evilyn04 junho

    Que lindo :3

    beijos visita?

    http://cantinhodaevilyn.blogspot.com.br/

    ResponderExcluir
  4. ✖~ Nakashita Beel05 junho

    hmm bem legal, curtii o tuto, :) so queria uma visualização :s
    -kissus-

    ResponderExcluir
    Respostas
    1. Roberta05 junho

      Tô usando ela no blog, e no post mostro ela na imagem do panda ^^
      Bjus

      Excluir

Muito obrigada por seu comentário e por sua presença! Ambos são super importantes para mim.

Apenas peço que:
- Comente a vontade, dê sua opinião, faça críticas, esclareça suas dúvidas e dê suas sugestões sobre o assunto referente às postagens;
- Use um vocabulário livre para todas as idades;
- Não ofenda ninguém em hipótese alguma.

Os comentários são moderados e não são permitidos comentários de pessoas que não se identifiquem. Algumas dúvidas podem ser previamente esclarecidas na F.A.Q, assim como créditos e outras coisas.

Por favor, entrem em contato por meio das redes sociais também para dúvidas, sugestões, pedidos ou outros:
Facebook - Twitter - Deviantart

up