Generando un Scroll con hojas de estilo

Publicado en octubre 24, 2005 24 comentarios

CSS nos brinda varias propiedades útiles al momento de controlar nuestras capas. La propiedad Overflow es capaz de generar un scroll cuando el contenido excede sus límites de ancho y alto.

En esta oportunidad les enseñaré la propiedad Overflow de CSS capaz de generar un scroll cuando el contenido dentro de un elemento excede las propiedades de su ancho y su alto.

Podemos usar la propiedad Overflow si queremos tener un mayor control sobre nuestras capas.

Para que Overflow funcione correctamente hay que definir las siguientes propiedades:

  • Background
  • Width
  • Height
  • Overflow
  • Visible (opciona)
  • Hidden (opcional)
  • Auto (opcional)
  • Inherit (opcional)

Para generar un scroll en cualquier parte del texto puedes copiar el siguiente ejemplo:

<html>
  <head>
  <style  type="text/css">
  div {background: white;  width:200px; height:100px; overflow: scroll}
  </style>
  </head>
  <body>

  <div>Aquí me pongo a cantar al compás de la  vigüela, que el hombre que lo desvela una pena estrordinaria, como la ave  solitaria con el cantar se consuela.<br>José  Hernández<br><u>El gaucho Martín Fierro</u></div>

  </body>
  </html>

Un ejemplo del anterior código es el que se utiliza en nuestro editorial para mostrar códigos HTML o de programación.

Federico Elgarte Federico Elgarte
Webmaster de cssboulevar.com.ar
Síguenos en
24 comentarios
310