خصوصیت perspective

مثال

ایجاد دور نما برای یک عنصر:

div
{
perspective: 500px;
-webkit-perspective: 500px; /* Safari and Chrome */
}

پشتیبانی مرورگرها

    

مرورگرهای Firefox و IE 10 خصوصیت  perspective را پشتیبانی می کنند.

مرورگرهای Safari و Chrome خصوصیت جایگزین webkit-perspective- را پشتیبانی می کنند.

تعریف و کاربرد

با استفاده از خصوصیت perspective می توان مشخص کرد که یک عنصر سه بعدی در چند پیکسلی دید کاربر قرار گیرد. این خصوصیت به شما  اجازه می دهد تا دور نمای عناصر سه بعدی را تغییر دهید تا نمای آنها تغییر یابند.

هنگامی که برای یک عنصر خصوصیت perspective تنظیم مس شود. در حقیقت، فرزندان این عنصر دورنما پیدا می کنند نه خود عنصر! 

توجه: خصوصیت perspective تنها روی عناصری که به دلیل اعمال انتقال سه بعدی شده اند، کار می دهد.

نکته: خصوصیت perspective را به همراه خصوصیت perspective-origin به کار ببندید. این کار به شما اجازه می دهد، مکان پایینی عنصر سه بعدی را تغییر دهید.

کاربران chrome و Safari برای درک بهتر خصوصیت perspective این دمو  demo را ملاحظه فرمایید.

مقدار پیشفرض none
ارث بری خیر
نسخه CSS3
JavaScript ساختار object.style.perspective=500px

نحوه استفاده

perspective: number|none;
Property مقدار توضیحات
number

عنصر در چند پیکسلی دید کاربر قرار گیرد.
none

دورنمایی برای عنصر تنظیم نشده است. مشابه مقدار صفر است. این مقدار پیش فرض است.