div ( z-index: 1; /* integer */ )
A z-index
CSS tulajdonság vezérli az átfedő elemek függőleges egymásra rakási sorrendjét. Mint abban, melyik jelenik meg, mintha fizikailag közelebb lenne hozzád. z-index
csak azokat az elemeket érinti, amelyeknek az static
(alapértelmezett) értéktől eltérő pozícióértéke van .
Az elemek többféle okból átfedhetik egymást, például a relatív pozícionálás valami másra bökte. A negatív margó az elemet egy másik fölé húzta. Az abszolút helyzetben lévő elemek átfedik egymást. Mindenféle ok.
z-index
Érték nélkül az elemek abban a sorrendben halmozódnak, ahogyan a DOM-ban megjelennek (ugyanazon a hierarchián a legalsó lent van fent). A nem statikus helyzetű elemek mindig az alapértelmezett statikus helyzetű elemek tetején jelennek meg.
Vegye figyelembe azt is, hogy a fészkelés nagy szerepet játszik. Ha egy B elem az A elem tetején ül, akkor az A elem gyermekelemje soha nem lehet magasabb, mint a B elem.
Ne feledje, hogy az IE régebbi verziója kissé elcseszi ezt a kontextust. Itt van egy jQuery javítás erre.
Több információ
- Screencast: Hogyan működik a z-index
- MDN Docs
- Átfogó cikk: A z-index megértése
- Racionális z-index értékek
Böngésző támogatás
Króm | Szafari | Firefox | Opera | AZAZ | Android | iOS |
---|---|---|---|---|---|---|
Művek | Művek | Művek | Művek | 4+ | 4+ | Művek |