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

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

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 <head> y </head>:

<link href= “scrollbar.css” type= “text/css” rel= “stylesheet”>

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 <div> 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:

<div class= “scrollbars”> My Page Contents (Los contenidos de mi página) </ div>

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 "<div class= "scrollbars"> 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.