Hoje em dia, como sempre falo, há muitos meios de personalizações de seu blog. Entre eles está o CSS uma linguagem simples de entender, que permite personalizar seu blog inserindo um código acima da tag de fachamento "skin". Hoje, iremos aprender como personalizar a sua barra de rolagem padrão(do sistema) por sua própria barra de rolagem personalizado com CSS3! "Let's Go"!
1. Acessando o painel de seu blog, procure por Modelo > Editar HTML.
2. Logo após, pressione Ctrl+F para abrir o Localizador de seu navegador e procure por:
]]></b:skin>
3. Imediatamente acima desta tag, cole o código CSS3:
::-webkit-scrollbar {width: 10px;height: 10px;-webkit-border-radius: 16px;}::-webkit-scrollbar-track-piece {background-color: #ffffff;-webkit-border-radius: 3px;}::-webkit-scrollbar-thumb:vertical {height: 5px;background-color: #666;-webkit-border-radius: 3px;}::-webkit-scrollbar-thumb:horizontal {width: 5px;background-color: #666;-webkit-border-radius: 3px;}
As partes destacadas de vermelho, representa a largura e a altura da sua barra; a azul, representa o valor do arredondamento da barra e por fim, as rosas os backgrounds(sugiro todos de uma cor só).
4. Clique em Visualizar e veja como ficou e se estar tudo correto, depois clique em Salvar.
Pronto! Dúvidas ou qualquer outro comentário sobre o mesmo, deixe seu comentário.
5 Comentários
Muito bom, gostei muito deste blog! Sucesso...
29 de dezembro de 2011 às 13:04Que bom que gostou Atalaia! Volte sempre!
29 de dezembro de 2011 às 14:30Primeira vez que vejo esse blog. É mt dahora :p isso pega em todos os navegadores?
1 de fevereiro de 2012 às 21:54Sim, funciona no Google Chrome, Firefox, no Internet Explorer 9, Opera 11 (ou superior), Safari 5. Não funciona totalmente bem nas versão antigas do Internet Explorer e do Opera. Espero lhe ter ajudado e obrigado pela participação. Volte sempre.
2 de fevereiro de 2012 às 00:33Nossa muito obrigado eu procurava por essa rolagem
5 de fevereiro de 2012 às 20:39Postar um comentário