Barra de Rolagem Personalizada - Scrollbar

Olá, blogueiros nesse artigo vou tratar de como personalizar (modificar) a barra de rolagem, na imagem você pode perceber a diferença da barra padrão a 1º  e a 2º  modificada.
Segue o tutorial abaixo:

1º  Acesse o painel do Blogger ~~>  Design
2º  Clique em editar HTML procure (Ctrl+f) por :

]]></b:skin>

3º Adicione o seguinte código acima antes:

::-webkit-scrollbar{width: 13px;height: 5px;}

::-webkit-scrollbar-track-piece{background: #caccce}

::-webkit-scrollbar-thumb:vertical{border-top:1px solid #656565;border-bottom:1px solid #656565;height: 5px;background-color: #939393;}
::-webkit-scrollbar-thumb:horizontal{border-top:1px solid #656565;border-bottom:1px solid #656565;width: 5px;background-color: #939393
};

Visualize e salve.
Demonstração da barra de rolagem aqui

Em Vermelho você pode modificar o tamanho.
Em Amarelo a cor. Tabela de cor
Em Verde a borda . CSS Border

Siga o @Cafe_Blogueiro no Twitter e Curta nossa página no facebook.