overflow
Establece un valor que indica cómo administrar el contenido del objeto cuando supera el alto y el ancho del objeto.
Sintaxis
{ overflow: sOverflow }
Valores posibles
sOverflow
Cadena que especifica uno de los valores siguientes:
visible |
Valor predeterminado. El contenido no se recorta y no se agregan barras de desplazamiento. |
auto |
El contenido se recorta y se agrega el desplazamiento solo si es necesario. |
hidden |
No se muestra el contenido que supera las dimensiones del objeto. |
scroll |
El contenido se recorta y se agregan las barras de desplazamiento, incluso si el contenido no supera las dimensiones del objeto. |
La propiedad tiene el valor predeterminado visible para todos los objetos, con la excepción de textarea , que tiene el valor predeterminado auto . Esta propiedad no se hereda.
Observaciones
El valor predeterminado para el elemento body es auto .
Si se establece la propiedad overflow en hidden o textarea el objeto oculta sus barras de desplazamiento.
Si se establece la propiedad overflow en visible , el contenido se recorta al tamaño de la ventana o marco que contiene el objeto.
Ejemplos
En el siguiente ejemplo se usa la propiedad overflow para administrar el contenido del objeto. Se utiliza un estilo en línea para que se ajuste automáticamente al contenido desbordado al cargar la página:
<div id=odiv style="width: 200px; height: 200px; overflow: auto;">
:
</div>
En este ejemplo, el usuario puede cambiar la propiedad overflow de un objeto DIV de forma dinámica al elegir uno de los valores de desbordamiento posibles de un objeto select :
<script>
function SetOverflow(o, svalue )
{
o.style.overflow = svalue ;
}
</script>
<div id="div1"
style="font-size:18pt;background-color:yellow;height:50px;width:75px">
The quick brown fox jumps over the lazy dog.
</div>
<select onchange="SetOverflow(div1,
this.options[this.selectedIndex].text)">
<option selected>visible
<option>scroll
<option>hidden
<option>auto
</select>
Información sobre estándares
Esta propiedad se define en la especificación Cascading Style Sheets (CSS), Level 2 (CSS2) (Hojas de estilos en cascada (CSS), nivel 2 (CSS2)) .png "Ee371234.xtlink_newWindow(es-es,Expression.40).png")
.
Aplicable a
a, abbr, acronym, address, applet, b, bdo, big, blockquote, body, center, cite, code, col, colgroup, custom, dd, defaults, del, dfn, div, dl, dt, em, embed, fieldset, font, form, html, hn, i, input type=button, input type=checkbox, input type=file, input type=image, input type=password, input type=radio, input type=reset, input type=submit, input type=text, ins, li, ol, p, q, rt, ruby, s, span, sub, tt, u, ul, var, xmp
Vea también
Conceptos
Copyright © 2011 de Microsoft Corporation. Reservados todos los derechos.