Barra de rolagem colorida

Ja devem ter percebido que sou louca pelo Yuya Matsushita... U-U

Oioi seus lindos!

Bom, todos os posts anteriores foram feitos pela Ni-chan e esse é meu primeiro então queria que fosse útil não necessáriamente especial e tal por isso postarei um tutorial que vai deixar seu blog mais leve e a sua cara só se você usar, claro! Vamos ao tutorial?? Aperte leia mais!

Esse tutorial tem um código meio grandinho mas é bem simples de entender, e se tiver alguma dúvida clique aqui que talvez esteja mais explicado!

É o seguinte, a sua barra de rolagem vai ficar do jeito que esta a baixo:

Vai em design, clique no botão editar HTML, clique no seu teclado ctrl+f e procure por ]]></b:skin>

Acima dele cole o código a seguir:

::-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;}

Personalizando:
O código #e7b3c2 é a cor da barra de rolagem.
O código #fff é a borda da barra de rolagem.
Onde está escrito FUNDO DA BARRA DE ROLAGEM é o ulr do background
você pode consultar a tabela de cores aqui!