Cómo ocultar un DIV desbordamiento

El conocimiento de CSS (Cascading Style Sheets) le da al diseñador de páginas web casi poder mágico sobre el formato del contenido de la página Web. Un diseñador experto en CSS puede incluso hacer que el texto y otros contenidos parecen desaparecer.

La propiedad CSS DIV (división de la página web), le permite dividir su contenido en bloques discretos. Cada bloque se puede formato y el estilo. El diseño de una página Web a menudo dicta que bloques de contenido encajan en ranuras predeterminadas de una altura y anchura específica. A veces, la cantidad de contenido en un bloque excede el espacio asignado a la misma. Cuando esto sucede, el exceso de contenido se "atropellado" y cubrir el contenido por debajo de ella. El visitante página web verá un lío mezclado con el contenido cubre otros contenidos. La propiedad "desbordamiento" CSS proporciona una manera de evitar que esto suceda.

Instrucciones

1 Abra la aplicación de edición de HTML. Cargar la página Web que contiene el DIV que desea editar. Si está utilizando un WYSIWYG (lo que ves es lo que obtienes), cambie al modo HTML o fuente, de manera que se puede ver y editar el código HTML real.

2 Seleccione el DIV que desea aplicar la propiedad "desbordamiento" de. La altura de la DIV debe fijarse a una altura específica usando la propiedad CSS, "altura". Por ejemplo, si desea que su DIV a ser de 200 píxeles de alto, agregue este estilo CSS: "<div style =" height: 200px ">".

3 Agregue el siguiente valor de la propiedad de estilo DIV: "overflow: hidden;". El CSS DIV propiedad "desbordamiento" le permite controlar la cantidad de contenido que se muestra y evitar el contenido de la propiedad "desbordamiento" tiene varios valores para el diseñador para elegir entre "atropellado". Visible, oculto, de desplazamiento, de automóviles y heredar. El valor de la propiedad "desbordamiento" cortes "ocultos" desactivar la visualización de contenido a la altura predeterminada DIV. Por ejemplo si su DIV tiene un ancho de 400 píxeles y una altura de 200 píxeles de su DIV sería: "<div style =" width: 400px; altura: 200px; overflow: hidden ">".

4 Guarda el archivo. Probar su diseño. Abra su navegador de Internet y cargar la página web que ha trabajado. Cualquier contenido que no encaja dentro del límite de las 200 píxeles que estableció se recorta o se oculta a la vista. El contenido de exceso de flujo es todavía allí, pero el visitante de la página no verlo. Ajustar la altura de la DIV hasta que pueda mostrar la mayor cantidad de contenido en el espacio de diseño de página permite.

Consejos y advertencias

• Otra característica de "desbordamiento", añade barras de desplazamiento para el DIV. La adición de "overflow: scroll" a su DIV de contenido permite al visitante utiliza barras de desplazamiento para ver todo el contenido.