Z-Index mit einem Visualisierungstool lernen 

Avatar of Chris Coyier
Chris Coyier am

DigitalOcean bietet Cloud-Produkte für jede Phase Ihrer Reise. Starten Sie mit 200 $ kostenlosem Guthaben!

Es gibt einige nette interaktive Demos hier von Thiru Manikandan. Es gibt ein paar sehr knifflige Dinge mit z-index, die nie aufhören zu verwirren. Zusätzlich zu Dingen wie der Anforderung von Positionierung und Quellreihenfolge sind die kniffligsten die Stapelkontexte und Eltern/Kind-Beziehungen. z-index ist kein flaches Spielfeld. Selbst wenn Sie z-index: 2147483644¹ auf ein Element setzen, passiert möglicherweise nichts, da sich dieses Element innerhalb eines Elternelements mit eigenem Stapelkontext und einem niedrigeren z-index als ein Geschwisterelement oder ein DOM-Element auf einer höheren Ebene befinden könnte.

  1. Nur drei weniger als das Maximum 2147483647. LOLZ. Hut ab vor Dan Danney, der erwähnte, dies kürzlich in freier Wildbahn gesehen zu haben.

Direkter Link →