روی هم قرار دادن عناصر
هنگامی که برای عناصر مختلف در یک صفحه از مشخه ی position استفاده کنید ممکن است شاهد هم پوشانی عناصر (قرار گرفتن یک عنصر بر روی عنصر دیگر) باشید. مشخصه ی z-index این امکان را برای شما فراهم میکند تا عناصر را در محور z (عمق صفحه) نیز مرتب سازی کنید.
با استفاده از این مشخصه میتوانید تعیین کنید کدام عنصر به صفحه نمایش نزدیک تر باشد و کدام عنصر در عمق قرار داشته باشد و عناصر را جلوی سایر عنصرها قرار دهید. مقداری که z-index دریافت میکند میتواند یک مقدار مثبت یا منفی باشد:
آندسته از عناصر که دارای عدد بزرگتری باشند، جلوتر از سایر عناصر نمایش داده میشوند. به عنوان مثال z-index: 3 جلوتر از z-index: 2 قرار میگیرد.
اگر مشخصه ی z-index را تعریف نکرده باشید، آن عنصری که در صفحه ی HTML زودتر فراخوانده شده باشد، زیرتر قرار میگیرد.
