A z-index tulajdonság

A CSS2 szabvány az egyes elemeket három dimenzióban helyezi el, azaz minden egyes elemnek van egy szintje a harmadik dimenzióban is. Ennek akkor van jelentősége, ha valamilyen ok miatt az egyes elemeket tartalmazó dobozok átfedik egymást.

E szerint a modell szerint minden doboz elképzelhető úgy, mint egy önálló fólián elhelyezett téglalap, amely fóliának a téglalapon kívüli része átlátszó, még a téglalap területéből csak az átlátszó, amely annak van definiálva. A fóliák egymásra helyezésének sorrendje pedig meghatározza, hogy melyik elem doboza fog látszani, ha egymást átfedik a dobozok.

Minden doboz egy ilyen egymásra pakolást előíró környezetbe sorolható. Egy adott környezeten belül pedig minden doboz rendelkezik egy egész számmal, amely a pakolásbeli sorszámát jelenti. Ezt nevezi a szabvány z-axisnak. A magasabb értékkel rendelkező dobozok közelebb vannak a felhasználóhoz, aki a képernyő előtt ül. Az érték lehet negatív is. Alaphelyzetben egy adott környezeten belül elhelyezkedő elemek dobozai a forrás dokumentum elem-fáján való előfordulásuk sorrendjében fentről lefelé kapják a sorszámukat.

A kezdő elem (általában a HTML vagy a BODY, amelyet a dokumentum-fa gyökér elemének is szokás nevezni) hozza létre a fő környezetet, de egyéb elemek létrehozhatnak saját helyi környezetet is. A környezetet, amelybe tartoznak, az elemek öröklik.

Egy elem, amely önálló pakolási környezetet hoz létre, egy olyan dobozt állít elő, amelynek két z-szintje van: az egyik mindig nulla értékő, amely a helyi környezetbeli értéket adja meg, és egy másik, amely az örökölt környezetbeli helye a doboznak.

Egy elem ugyanazt a szintet kapja, amit az őse, kivéve, ha mást állít be a z-index tulajdonság.

Ennek a tulajdonságnak az értéke lehet a következő:

• inherit: szokás szerint ez az érték azt eredményezi, hogy az elem az ősének azonos tulajdonságától örökli az értéket.
• auto: alapértelmezésben az a tulajdonság értéke
• egy egész szám: az elem dobozának szintje a fentebb leírtak alapján.

A tulajdonság meghatározza, hogy

1. mi legyen a sorszáma a doboznak az aktuális környezetben;
2. hozzon-e létre a doboz új, helyi környezetet az elem leszármazottai számára.

Ha értéke nulla, akkor a doboz új, helyi környezetet hoz létre, egyébként a meglévő környzeteben mondja meg a doboz magasságát.