Como colocar barra de rolagem no blog

Oii meninas tudo bem ??

 

Bom hoje eu exclui uma postagem *De como colocar barra de rolagem no blog* Porque tava um pouquinho mal feito e eu agora estou refazendo essa postagem

 

Espero que gostem ..

 

Redonda: Quadrada:

 

 

             ......

Bom a redonda vão ver logo-logo no blog .. rs

 

.............................................................................................................

Bom meninas 1 vou fazer o tutorial da redonda ...

Vá em designer - Editar Htm - e aperte Ctrl + F para procurar esse codigo :

.............................................................................................................

 

 

                                      ]]></b:skin>

 

.............................................................................................................

 

 

Acima dele copie esse codigo : 

::-webkit-scrollbar-thumb:vertical {
background: #e7b3c2;height:50px;
border: 2px solid #fff;box-shadow: 2px 2px 4px #bebdbd;
-moz-box-shadow: 2px 2px 4px #bebdbd;
-webkit-box-shadow: 2px 2px 4px #bebdbd;
-khtml-box-shadow: 2px 2px 4px #bebdbd;
-moz-border-radius: 10px; /* Para Firefox */
-webkit-border-radius: 10px; /*Para Safari e Chrome */
border-radius: 10px; /* Para Opera 10.5+*/
}
::-webkit-scrollbar-thumb:horizontal {
background-color:#f26d92; height:10px;
border: 1px dashed #fff;
-webkit-box-shadow:0 0 1em #eee; }:
::-webkit-scrollbar {height:10px; width:20px; background: url(fundo da barra de rolagem) repeat;box-shadow: -3px -2px 10px #bebdbd;
-moz-box-shadow: -3px -2px 10px #bebdbd;
-webkit-box-shadow: -3px -2px 10px #bebdbd;
-khtml-box-shadow: -3px -2px 10px #bebdbd;}

 Agora vou ensinar a barra de rolagem quadrada ..

bom é o mesmo esquema só que com o codigo diferente ..

{
scrollbar-face-color:#9B30FF;
scrollbar-highlight-color:#9B30FF;
scrollbar-3dlight-color:#000000;
scrollbar-darkshadow-color:#000000;
scrollbar-shadow-color:#9B30FF;
scrollbar-arrow-color:#000000;
scrollbar-track-color:#000000;
}
::-webkit-scrollbar {width: 12px; height: 4px; background: #000000; }
::-webkit-scrollbar-thumb { background: #9B30FF; }

Vamos entender ::

Barra de rolagem: #9B30FF
Plano de fundo: #000000

Pronto so visualizar esalvar ...

Se quiser mudar as cores troque só os codigos por exemplo : #9B30FF

 

  Clique aqui para ver os codigos de cores ..   

 

Cute World