Personalizando a barra de rolagem Com CSS

Olá amigos leitores, nesta post ensinarei um tutorial bastante legal, nele ensinarei como mudar a barra de rolagem do seu blog por outra bem bonita, e além de tudo com CSS.


Também já ensinei aqui no meu blog como mudar a barra de rolagem do blogger por outra.
Se você quiser ela também e muito elegante.
Veja o link abaixo:

• Personalizando a barra de rolagem dos blogs do blogger - Tecnoblog

Mas, vamos começar o tutorial:


Começando o tutorial:
1. Acesse o painel do seu blog e clique no Guia Modelo.

2. Depois disso, clique no Botão "Editar HTML".

3. Agora segure as teclas CTRL+F e procure por:

]]></b:skin>

4. E acima da tag citada acima cole o seguinte código

/* ---------------- Barra de rolagem Google Chrome---------------- */
::-webkit-scrollbar {
width: 15px; <!-- largura da barra de rolagem -->
height: 5px;
}
::-webkit-scrollbar-track-piece {
background: #aebcbf; <!-- Cor do fundo da barra de rolagem -->
}
::-webkit-scrollbar-thumb:vertical {
height: 5px;
background: #000; <!-- Cor da barra de rolagem -->
border-radius: 10px; <!-- Arredondamento da barra de rolagem -->
}
::-webkit-scrollbar-thumb:horizontal {
width: 5px; <!-- Largura da barra de rolagem na horizontal-->
background-color: #FFA500; <!- cor da barra de rolagem na horizontal-->
}

Pronto agora é só aproveitar a sua nova barra de rolagem!
Atenção: Só testei no Google Chrome