Eigenschaft visibility
Die Eigenschaft visibility legt die Unsichtbarkeit
eines Elements fest. Dabei verhalten sich alle anderen Elemente
so, als ob das Element nirgendwo
verschwunden wäre.
Syntax
Selektor {
visibility: visible oder hidden oder collapse;
}
Werte
| Wert | Beschreibung |
|---|---|
visible |
Das Element ist sichtbar. |
hidden |
Das Element wird unsichtbar, gleichsam durchsichtig, und nimmt weiterhin an der Seitenformatierung teil. |
collapse |
Wenn man collapse für den Inhalt von Tabellenzellen verwendet,
verschwinden diese scheinbar, und die Tabelle
wird neu aufgebaut.
Wenn dieser Wert nicht auf Tabellenzeilen oder -spalten angewendet wird, ist das Ergebnis der Verwendung dasselbe wie bei hidden.
|
Standardwert: visible.
Beispiel
Lassen Sie uns den Text des ersten Absatzes anfangs
unsichtbar machen, aber wenn der Mauszeiger über die Schaltfläche
'Show text' bewegt wird, sollen wir ihn lesen können:
<button>Show text</button>
<div class="text">text1</div>
<div>text2</div>
div{
border: 1px solid black;
width: 100px;
}
.text {
visibility: hidden;
}
button:hover + .text {
visibility: visible;
}
:
