div ( z-index: 1; /* integer */ )z-indexProprietatea în CSS controlează ordinea de stivuire verticală a elementelor care se suprapun. Ca în, care apare ca și cum ar fi mai aproape fizic de tine. z-indexafectează numai elemente care au o valoare de poziție diferită de static(valoarea implicită).
Elementele se pot suprapune din mai multe motive, de exemplu, poziționarea relativă a împins-o peste altceva. Marja negativă a tras elementul peste altul. Elementele poziționate absolut se suprapun reciproc. Tot felul de motive.
Fără nicio z-indexvaloare, elementele se stivuiesc în ordinea în care apar în DOM (cel mai jos în jos la același nivel de ierarhie apare deasupra). Elementele cu poziționare nestatică vor apărea întotdeauna deasupra elementelor cu poziționare statică implicită.
De asemenea, rețineți că cuiburile joacă un rol important. Dacă un element B se află deasupra elementului A, un element secundar al elementului A nu poate fi niciodată mai mare decât elementul B.
Rețineți că versiunea mai veche a IE face ca aceste lucruri de context să fie cam înșelate. Iată o soluție jQuery pentru asta.
Mai multe informatii
- Screencast: Cum funcționează indexul z
- Documente MDN
- Articol cuprinzător: Înțelegerea indexului z
- Valori raționale ale indexului z
Suport pentru browser
| Crom | Safari | Firefox | Operă | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Lucrări | Lucrări | Lucrări | Lucrări | 4+ | 4+ | Lucrări |