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:
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
Vou modificar agora mesmo a minha scrollbar, estava precisando desse tutorial! ^^
ResponderExcluirsempre-divando.blogspot.com
Gostei,estou aprendendo a usar o HTML agora e isso vai me ajudar bastante :3
ResponderExcluirQue lindo :3
ResponderExcluirbeijos visita?
http://cantinhodaevilyn.blogspot.com.br/
hmm bem legal, curtii o tuto, :) so queria uma visualização :s
ResponderExcluir-kissus-
Tô usando ela no blog, e no post mostro ela na imagem do panda ^^
ExcluirBjus