خصوصیت transform-style

مثال (خصوصیت transform-style)

در این مثال، عناصر فرزند تبدیل سه بعدی خودشان را حفظ می کنند:

div
{
transform: rotateY(60deg);
transform-style: preserve-3d;
-webkit-transform: rotateY(60deg); /* Safari and Chrome */
-webkit-transform-style: preserve-3d; /* Safari and Chrome */
}

خودتان امتحان کنید »

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

مرورگر Firefox خصوصیت transform-style را پشتیبانی می کند.

مرورگرهای Chrome و Safari از خصوصیت جایگزین webkit-transform-style- استفاده می کنند.

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

با استفاده از خصوصیت transform-style می توان نحوه چرخیدن عناصر تو در تو را در فضای سه بعدی مشخص کرد.

توجه: این خصوصیت می بایست با خصوصیت transform به کار گرفته شود.

کاربران Chrome و Safari: برای درک بهتر خصوصیت transform-style به view a demo مراجعه فرمایید.

مقدار پیشفرض	flat
ارث بری	خیر
نسخه	CSS3
JavaScript ساختار	object.style.transformStyle="preserve-3d"

نحوه استفاده

transform-style: flat|preserve-3d;

Property مقدار	توضیحات
flat	عناصر فرزند موقعیت سه بعدی خود را حفظ نمی کنند.
preserve-3d	عناصر فرزند موقعیت سه بعدی خود را نگه می دارند.

: نوشته شده توسط امیر پهلوان صادق; بازدید: 6929

برای درج دیدگاه، ابتدا باید وارد بیاموز شوید.

تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.

مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی