z-index

(Auszug aus "CSS − Anspruchsvolle Websites mit Cascading Stylesheets" von Rachel Andrew & Dan Shafer)

Die Eigenschaft z-index beschreibt die Position eines nicht mit static positionierten Elements in einem Stapel sich überlappender Elemente.

Elemente, die mit static oder gar nicht positioniert sind, befinden sich im selben Stapelkontext immer unterhalb von Elementen, die mit absolute oder relative positioniert sind. Ihr z-index beträgt 0. Elemente im gleichen Stapelkontext mit demselben Wert für z-index werden in der Reihenfolge ihrer Erwähnung im HTML-Code gestapelt, das erstgenannte nach unten, das letztgenannte nach oben.

Vererbt: nein

Siehe auch: position

Wert

Eine positive, ganze Zahl oder die Konstante auto. Je höher der numerische Wert, desto weiter oben die Position.

Bei Verwendung der Konstante auto verhält sich das Element wie mit einem z-index von 0. Es erzeugt allerdings keinen neuen Stapelkontext, sondern integriert sich an unterster Position in einen bestehenden Stapelkontext.

Standardwert: auto

Kompatibilität

CSS-Version: 2

Funktioniert in allen CSS-fähigen Browsern, einschließlich Netscape 4.

Beispiel

Folgende Stilregel positioniert das Element mit der ID hauptmenue zehn Pixel von der linken oberen Ecke des Browserfensters entfernt. Kommt es zu einer Überlappung, lässt es der z-index über anderen Elementen mit einem niedrigeren z-index schweben:

#hauptmenue {
 position: absolute;
 top: 10px;
 left: 10px;
 width: 100px;
 height: 300px;
 z-index: 10;
}

  

<< zurück vor >>

 

 

 

Tipp der data2type-Redaktion:
Zum Thema CSS bieten wir auch folgende Schulungen zur Vertiefung und professionellen Fortbildung an:

Copyright © 2006 der deutschen Übersetzung dpunkt.verlag GmbH
Für Ihren privaten Gebrauch dürfen Sie die Online-Version ausdrucken.
Ansonsten unterliegt dieses Kapitel aus dem Buch "CSS − Anspruchsvolle Websites mit Cascading Stylesheets" denselben Bestimmungen, wie die gebundene Ausgabe: Das Werk einschließlich aller seiner Teile ist urheberrechtlich geschützt. Alle Rechte vorbehalten einschließlich der Vervielfältigung, Übersetzung, Mikroverfilmung sowie Einspeicherung und Verarbeitung in elektronischen Systemen.

dpunkt.verlag GmbH, Ringstraße 19, 69115 Heidelberg