visibility

Übersicht

Die visibility Eigenschaft legt fest, ob ein Element sichtbar ist.

Sie kann dazu verwendet werden, ein Element zu verstecken, aber den Raum, den es eingenommen hÀtte zu belassen. Sie kann auch Zeilen oder Spalten einer Tabelle verstecken.

Initialwertvisible
Anwendbar aufalle Elemente
VererbtJa
Berechneter Wertwie angegeben
AnimationstypSichtbarkeit

Syntax

/* SchlĂŒsselwortwerte */
visibility: visible;
visibility: hidden;
visibility: collapse;

/* Globale Werte */
visibility: inherit;
visibility: initial;
visibility: unset;

Werte

visible
Standardwert. Das Element ist sichtbar.
hidden
Das Element ist unsichtbar (komplett transparent), es beeinflusst jedoch immernoch das Layout. Kindelemente mit visibility:visible sind sichtbar (funktioniert nicht im IE bis Version 7).
collapse
Bei Tabellenzeilen, Spalten und Zeilengruppen wird/werden die Spalte(n) bzw. Zeile(n) entfernt und der Platz, den sie eingenommen hĂ€tten, wird entfernt (als ob display: none; fĂŒr die Zeile/Spalte der Tabelle angegeben worden wĂ€re). Jedoch wird die GrĂ¶ĂŸe der anderen Zeilen und Spalten immer noch so berechnet, als ob die zusammengefallene(n) Zeile(n)/Spalte(n) da wĂ€ren. Die Funktion ist zum schnellen Entfernen von Tabellenspalten/-zeilen gedacht ohne die Breiten und Höhen jedes Teils der Tabelle neuberechnen zu mĂŒssen. FĂŒr XUL-Elemente ist die berechnete GrĂ¶ĂŸe des Elements immer 0, unabhĂ€ngig von anderen Styles, die normalerweise die GrĂ¶ĂŸe beeinflussen wĂŒrden. Jedoch werden AußenabstĂ€nde immer noch berĂŒcksichtigt. Bei anderen Elementen ist collapse gleichbedeutend zu hidden.

Interpolation

Sichtbarkeitswerte sind interpolierbar zwischen sichtbar und nicht sichtbar. Einer der Start- oder Endwerte muss daher visible sein, damit eine Interpolation stattfinden kann. Falls einer der Werte visible ist, wird er in einem einzelnen Schritt interpoliert, wobei Werte der Timingfunktion zwischen 0 und 1 auf visible und andere Werte der Timingfunktion (welche nur am Start/Ende des Übergangs oder als das Ergebnis aus cubic-bezier() Funktionen mit y-Werten außerhalb von [0, 1]) abgebildet werden.

Formale Syntax

visible | hidden | collapse

Beispiele

p        { visibility: hidden; }    /* AbsÀtze sind unsichtbar */
p.showme { visibility: visible; }   /* AbsÀtze der Klasse "showme" sind sichtbar */
tr.col   { visibility: collapse; }  /* Tabellenzeilen mit der Klasse "col" fallen zusammen. */

Hinweise

Die UnterstĂŒtzung von visibility:collapse fehlt oder ist teilweise fehlerhaft in manchen modernen Browsern. In einigen FĂ€llen wird es bei Elementen mit Ausnahme von Tabellenzeilen und -spalten nicht korrekt interpretiert.

visibility:collapse kann die Darstellung einer Tabelle Àndern, falls die Tabelle verschachtelte Tabellen in den zusammengefallenen Zellen beinhaltet, sofern visibility:visible explizit bei den Tabellen angegeben ist.

Spezifikationen

Spezifikation Status Kommentar
CSS Basic Box Model
Die Definition von 'visibility' in dieser Spezifikation.
Arbeitsentwurf Keine Änderungen
CSS Transitions
Die Definition von 'visibility' in dieser Spezifikation.
Arbeitsentwurf Definiert visibility als animierbar.
CSS Level 2 (Revision 1)
Die Definition von 'visibility' in dieser Spezifikation.
Empfehlung UrsprĂŒngliche Definition

BrowserkompatibilitÀt

BCD tables only load in the browser