div ( z-index: 1; /* integer */ )CSS'deki z-indexözellik, üst üste binen öğelerin dikey yığınlama sırasını kontrol eder. Sanki fiziksel olarak size daha yakınmış gibi görünen biri. z-indexyalnızca static(varsayılan) dışında bir konum değerine sahip öğeleri etkiler .
Öğeler çeşitli nedenlerle üst üste gelebilir, örneğin göreceli konumlandırma onu başka bir şeyin üzerine itmiştir. Negatif marj, öğeyi diğerinin üzerine çekti. Kesinlikle konumlandırılmış öğeler birbiriyle örtüşüyor. Her türlü sebep.
Herhangi bir z-indexdeğer olmadan , öğeler DOM'da göründükleri sırayla yığınlanır (aynı hiyerarşi düzeyindeki en düşük olan en üstte görünür). Statik olmayan konumlandırmaya sahip öğeler her zaman varsayılan statik konumlandırmayla öğelerin üstünde görünür.
Ayrıca yuvalanmanın büyük bir rol oynadığını unutmayın. Bir B öğesi, A öğesinin üstüne oturursa, A öğesinin bir alt öğesi hiçbir zaman B öğesinden daha yüksek olamaz.
IE'nin eski sürümünün bu bağlamı biraz bozduğuna dikkat edin. İşte bunun için bir jQuery düzeltmesi.
Daha fazla bilgi
- Ekran video kaydı: Z-endeksi nasıl çalışır?
- MDN Belgeleri
- Kapsamlı makale: Z-endeksini anlama
- Rasyonel z-endeksi Değerleri
Tarayıcı Desteği
| Krom | Safari | Firefox | Opera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| İşler | İşler | İşler | İşler | 4+ | 4+ | İşler |