Cómo poner una barra de desplazamiento en mi página

Por david gitonga
La adición de barras de desplazamiento en una página web requiere una pequeña pieza de código CSS.

Al leer un correo electrónico o al desplazarte a través de un documento Word o de texto, querrás tener la barra de formato a la vista en todo momento. Esto se logra más bien al tener barras de desplazamiento dentro de los contenedores. Cascading Style Sheets (CSS – en inglés) se utiliza para producir secciones desplazables de tu página web o para hacer que toda la página use las barras de desplazamiento con unas pocas líneas de código. Una propiedad CSS llamada "desbordamiento" se utiliza para producir dichas barras en una página.

Paso 1

Abre la aplicación Bloc de notas y copia el código de abajo:

.scrollbars {overflow:scroll; height:300px;}

El código anterior define la propiedad "desbordamiento" y crea un cuadro de desplazamiento que es de 300px.

Paso 2

Guarda el archivo en el paso 1 como "scrollbar.css".

Paso 3

Abre la página en la que desees que aparezcan las barras de desplazamiento y agrega el código siguiente a la sección entre las pestañas y :

Esta línea de código hace referencia a la "scrollbar.css" que has creado y añade la información de ese archivo en tu página.

Paso 4

Utiliza las pestañas

para añadir las barras de desplazamiento a las partes de la página en las que desees que se apliquen las barras de desplazamiento como se muestra:

My Page Contents (Los contenidos de mi página)
El código anterior añade barras de desplazamiento a la zona de la página que contiene las " My Page Contents". Puedes especificar otras secciones de la página, simplemente añadiendo la línea "
al objetivo div.

Paso 5

Guarda "scrollbars.css" y la página para mostrar las barras de desplazamiento en el mismo directorio.

Paso 6

Abre la página con un navegador web para ver si se realiza adecuadamente.