Personalizando las barras de scroll del navegador en CSS

Personalizando las barras de scroll del navegador en CSS

A partir de la version 5.5 el navegador de internet mas utilizado en el mundo "Internet Explorer" soporta la personalizacion de sus barras de scroll, mediante hojas de estilo podemos obtener barras realmente atractivas, aqui un ejemplo...

Estas barras siguen funcionando igual que las anteriores lo unico que se modifica es su aspecto, veamos como llegamos a esto...

<style type="text/css">
<!--
body {
SCROLLBAR-FACE-COLOR:#6699CC;
SCROLLBAR-HIGHLIGHT-COLOR: #6699CC;
SCROLLBAR-SHADOW-COLOR: #6699CC;
SCROLLBAR-3DLIGHT-COLOR: #FFFFFF;
SCROLLBAR-ARROW-COLOR: #FFFFFF;
SCROLLBAR-TRACK-COLOR: #E3E3E3;
SCROLLBAR-DARKSHADOW-COLOR: #000000;
}
-->
</style>

Este codigo hay que insertarlo entre las etiquetas HEAD o en la hoja de estilo que utilizemos, ahora explicaremos que significa cada item...

• SCROLLBAR-FACE-COLOR - Color de la base de la barra
• SCROLLBAR-HIGHLIGHT-COLOR - Color resaltado de la barra
• SCROLLBAR-SHADOW-COLOR - Color de la sobra de la barra
• SCROLLBAR-3DLIGHT-COLOR - Color del relieve de la barra
• SCROLLBAR-ARROW-COLOR - Color de las flechas de la barra
• SCROLLBAR-TRACK-COLOR - Color del fondo de la barra
• SCROLLBAR-DARKSHADOW-COLOR - Color de la sobra mas oscura de la barra

Es complicado explicar cada item, lo que te recomiendo es que vayas cambiando los valores de los colores y que pruebes como va quedando.

Autor: El Guru Programador
http://www.elguruprogramador.com.ar/zonas/ver.asp?cod=17

Usuarios que han visto este tema también han visto...

- CSS: Etiquetas
- Cómo eliminar el subrayado de los enlaces con CSS
- Efecto zoom de imagen utilizando solo CSS
- Estilos en formularios: Bordes llamativos para campos de formulario en CSS
- Crear un menú dinámico con CSS

- Versión imprimible de este documento

- Enviar por e-mail este documento