|
La etiqueta css “scrollbar” es una excelente forma de darle un toque personalizado a nuestra página web de una forma sencilla. Gracias a esta etiqueta podemos cambiar el color de la barra desplazadora y configurar totalmente los colores de la misma.
Esta etiqueta deberemos incluirla entre las etiquetas <head> </head>. Vamos a ver cuál sería el código que tendríamos que utilizar:
<style type="text/css">
<!--
body {
scrollbar-face-color: #6685CA;
scrollbar-highlight-color: #6685CA;
scrollbar-shadow-color: #6685CA;
scrollbar-3dlight-color:#FFFFFF;
scrollbar-arrow-color:#FFFFFF;
scrollbar-track-color:#E5E5E5;
scrollbar-drakshadow-color:#000000;
}
-->
</style>
A continuación vamos a explicar las diferentes partes de la etiqueta. Cada una de las partes cambia el color de un elemento de la barra, por lo que es acertado conocerlas todas, para así poder personalizar la barra a nuestro gusto. Hemos acompañado la explicación con un dibujo, para que todo quede más claro. Pincha en la imagen para hacerla más grande.
- scrollbar-face-color – Indica el color de la base de la barra desplazadora.
- scrollbar-highlight-color - Indica el color resaltado de la barra desplazadora.
- scrollbar-shadow-color - Indica el color de la sobra de la barra desplazadora.
- scrollbar-3dlight-color - Indica el color del relieve de la barra desplazadora.
- scrollbar-arrow-color - Indica el color de las flechas de la barra desplazadora.
- scrollbar-track-color - Indica el color del fondo de la barra desplazadora.
- scrollbar-drakshadow-color - Indica el color de la sobra más oscura de la barra desplazadora.
|
|
Por último, diremos que la “scrollbar” sirve tanto para el navegador, como para los formularios y que esta barra sólo la reconoce el navegador explorer.
Artículo escrito por Alberto Gómez para HazUnaweb.com. Queda absolutamente prohibida su reproducción.
| 
