Propiedad de visibilidad CSS
Ejemplo
Haz que los elementos <h2> sean visibles y ocultos:
h2.a {
visibility: visible;
}
h2.b {
visibility: hidden;
}
Más ejemplos de "Pruébelo usted mismo" a continuación.
Definición y uso
La visibility
propiedad especifica si un elemento es visible o no.
Sugerencia: los elementos ocultos ocupan espacio en la página. ¡ Use la propiedad de visualización para ocultar y eliminar un elemento del diseño del documento!
Valor por defecto: | visible |
---|---|
Heredado: | sí |
Animable: | si. Leer sobre animable |
Versión: | CSS2 |
Sintaxis de JavaScript: | objeto .style.visibility="oculto" |
Compatibilidad con navegador
Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con la propiedad.
Property | |||||
---|---|---|---|---|---|
visibility | 1.0 | 4.0 | 1.0 | 1.0 | 4.0 |
Sintaxis CSS
visibility: visible|hidden|collapse|initial|inherit;
Valores de propiedad
Value | Description | Play it |
---|---|---|
visible | Default value. The element is visible | |
hidden | The element is hidden (but still takes up space) | |
collapse | Only for table rows (<tr>), row groups (<tbody>), columns (<col>),
column groups (<colgroup>). This value removes a row or column,
but it does not affect the table layout. The space taken up by the row or column
will be available for other content. If collapse is used on other elements, it renders as "hidden" |
|
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Más ejemplos
Ejemplo
Este ejemplo demuestra cómo colapsar un elemento de tabla:
tr.collapse {
visibility: collapse;
}
páginas relacionadas
Tutorial de CSS: Visualización y visibilidad de CSS
Referencia HTML DOM: propiedad de visibilidad