13 de enero de 2015

Scrollbar personalizado con CSS 1





Para cambiar el scrollbar o barra de navegación de tu blog de Blogger entra en►Diseño
►Diseñador de plantillas
►Avanzado
►Añadir CSS , y ahí en el campo, para Añadir código CSS personalizado, agregamos el siguiente código:


::-webkit-scrollbar{
width: 10px;
background: #dbe8ec;
}
::-webkit-scrollbar-button{
width:8px;
height: 5px;
}
::-webkit-scrollbar-track{
background:#3c454e;
border:thin solid #1a1f25;
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
-webkit-border-radius: 10px;
border-radius: 10px;
}
::-webkit-scrollbar-thumb{
background: -webkit-linear-gradient(top, #5aafb0, #4ca06d);
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,225,.5),
inset 1px 0 0 rgba(255,255,255,.4),
inset 0 1px 2px rgba(255,255,255,.3);
border:thin solid #232c34;
border-radius: 10px;
-webkit-border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover{
background: -webkit-linear-gradient(top, #4ca06d, #5aafb0);
}
/* Pseudo-clase */
::-webkit-scrollbar-thumb:window-inactive {
background: rgba(77,161,112,.6);
}
Luego presiona Aplicar al blog y abras cambiado el estilo del Scrollbar



No hay comentarios:

Publicar un comentario

Diseño por Blogger Sin Escalones Con la tecnología de Blogger.