ویژگی z-index CSS
- صفحه قبل writing-mode
- صفحه بعدی zoom
تعریف و استفاده
ویژگی zIndex ترتیب قرارگیری عنصر را تنظیم می‌کند. عنصر دارای ترتیب قرارگیری بالاتر همیشه در جلوی عنصر دارای ترتیب قرارگیری پایین‌تر قرار می‌گیرد.
نکته:عناصر می‌توانند دارای مقادیر منفی zIndex باشند.
نکته:Z-index تنها در عناصر قرار داده شده (مثلاً position:absolute;) مؤثر است!
توضیح
این ویژگی موقعیت یک عنصر قرار داده شده در محور z را تعیین می‌کند، محور z به عنوان محوری تعریف می‌شود که عمود به صفحه نمایش ادامه می‌یابد. اگر مقدار مثبت باشد، به کاربر نزدیک‌تر است و اگر مقدار منفی باشد، به کاربر دورتر است.
لطفاً به: مراجعه کنید
آموزش CSS:تعیین موقعیت CSS
دستورالعمل HTML DOM:ویژگی zIndex
مثال
z-index تصویر را تنظیم می‌کند:
img
{
position:absolute;
left:0px;
top:0px;
z-index:-1;
}
نوع CSS
z-index: auto|number|initial|inherit;
مقدار ویژگی
| مقدار | توضیح |
|---|---|
| auto | پیش‌فرض. ترتیب قرارگیری با عنصر والد برابر است. |
| number | ترتیب قرارگیری عنصر را تنظیم می‌کند. |
| inherit | مقدار z-index باید از عنصر والد به ارث برسد. |
جزئیات فنی
| مقدار پیش‌فرض: | auto |
|---|---|
| erbیت‌پذیری: | no |
| نسخه: | CSS2 |
| نوع جاوااسکریپت: | object.style.zIndex="1" |
مثال‌های بیشتر
پشتیبانی مرورگر
اعداد در جدول نشان‌دهنده نسخه اولین مرورگر پشتیبان از این ویژگی هستند.
| Chrome | IE / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| 1.0 | 4.0 | 3.0 | 1.0 | 4.0 |
- صفحه قبل writing-mode
- صفحه بعدی zoom
