Style

Assistant

Startseite
Screenshot
Kurzanleitung
Download
Kurse & Infos
>Tipps & Tricks<
Unterstützer
TMXtensions
?Freeware!
About TM
E-Mail
Made with CSS
Valid HTML 4.01!
Stand: 07.12.2002

Tipps & Tricks – Tipp 68
Zur Übersicht

68. Objekte ein-/ausblenden : display vs. visibility (27.10.2001)

Zum (dynamischen) Ein- bzw. Ausblenden von Objekten eines HTML-Dokuments lassen sich die CSS-Eigenschaften display bzw. visibility einsetzen. Die wichtigsten Werte für display sind block | none (sowie inline) und für visiblity visible | hidden.

Der entscheidende Unterschied in der Anwendung beider Eigenschaften besteht in der Art und Weise der resultierenden Anzeige. Während man mit visibility lediglich das Einblenden (visible) bzw. Ausblenden (hidden) erreicht, d. h. der Platz der Objekte bleibt erhalten, nimmt man mittels display das jeweilige Objekt komplett aus dem Dokumentenfluss (none) oder setzt es wieder hinein (block). Eine zusätzliche Option bietet display: inline, womit sich z. B. die Gruppierung von Blockelementen innerhalb einer Zeile erreichen lässt (sinnvoll etwa bei mehreren Formular-Submitbuttons).

Beispiel 68 demonstriert dieses Verhalten in moderneren Browsern, sofern JavaScript aktiviert ist.