Hola
queridísimos bloggers qué tal, cómo están?
espero que fenomenal
En la entrada de hoy les traigo un tutorial para poner un scroll Bar
- Scroll Bar efecto kawaii
Se puede colocar de dos formas
Forma 1:En un gadget
- Diseño
- Añadir gadget javascrip
<style>
::-webkit-scrollbar{ width:7px;height:7px;} /* Largura da barra */
::-webkit-scrollbar-track-piece{background-color:#fff;} /* Fondo de la barra larga */
::-webkit-scrollbar-thumb:vertical{height:50px; background-color:#6b8bba; /* Estilos da barra vertical */
box-shadow: inset 1px 1px 0px #fff;
border: 1px solid #6b8bba; /* Borde de la barra */
::-webkit-scrollbar-thumb:horizontal{width:50px; background-color:#6b8bba; /* Estilos de la barra horizontal */
box-shadow: inset 1px 1px 0px #fff;
border: 1px solid #6b8bba; /* Borde de la barra */
</style>
Forma 2:Incrustada en el código HTLM
- Plantilla
- Editar HTLM
- Crtlr+F & buscar & colocar antes de ]]></b:skin>
::-webkit-scrollbar{ width:7px;height:7px;} /* Largura da barra */
::-webkit-scrollbar-track-piece{background-color:#fff;} /* Fondo de la barra larga */
::-webkit-scrollbar-thumb:vertical{height:50px; background-color:#6b8bba; /* Estilos da barra vertical */
box-shadow: inset 1px 1px 0px #fff;
border: 1px solid #6b8bba; /* Borde de la barra */
::-webkit-scrollbar-thumb:horizontal{width:50px; background-color:#6b8bba; /* Estilos de la barra horizontal */
box-shadow: inset 1px 1px 0px #fff;
border: 1px solid #6b8bba; /* Borde de la barra */
}
Esas son las dos formas de colocarlo
Espero que este tutorial les haya gustado, es un tutorial muy fácil que deja bonitos resultados un beso enorme desde aquí :D y que pases una gran semana
Si te gustó esta entrada deja un comentario