بروز رسانی بهمن ۱ام, ۱۳۹۹ ۳:۳۴ بعد از ظهر
فروردین ۱۶, ۱۳۹۵ admin آموزش پیشرفته css, آموزش مقدماتی css 0
با بهره بری و استفاده از تابع translateZ
که جهت ویژگی transform مشخص کردن می می شود می قدرت یک عنصر را در فضای سه بعدی در جهت محور Z جابجا کرد.
مقداری که آن تابع می پذیرد می تواند واحد طولی یا درصدی داشته باشد. و همچنین آن مقدار باعث حرکت عنصر در راستای محور Z می می شود.
در زیر نمونه هایی از بهره بری و استفاده از آن تابع آورده شده می باشد:
transform: translateZ(300px);
transform: translateZ(-50%);
transform: translateZ(150%);
از واحدهای غیره ای مثل em و همچنین rem و همچنین قسمت و بخش و همچنین غیره هم می توانید جهت مقدار دهی به آن تابع بهره بری و استفاده کنید. همینطور مقدار می تواند منفی باشد. که در آن صورت عنصر در خلاف محور Z تغییر مکان خواهد داد.
لطفا دموی زیر را بررسی کردن کنید. توجه داشته باشید که تغییر مکان در حالت hover صورت می گیرد و همچنین همینطور از transition جهت واضح شدن حرکت بهره بری و استفاده شده می باشد:
See the Pen translateZ() by Mojtaba Seyedi (@seyedi) on CodePen.
کارشناس مهندسی نرم افزار, عاشق تکنولوژی های روز دنیای وب, مخصوصا سمت کلاینت.
بهمن ۰۱, ۱۳۹۹ 0
دی ۲۶, ۱۳۹۹ 0
خرداد ۰۳, ۱۳۹۹ 0
اردیبهشت ۰۹, ۱۳۹۹ 0
مرداد ۱۲, ۱۳۹۹ 0
اردیبهشت ۰۸, ۱۳۹۹ 0
خرداد ۱۴, ۱۳۹۶ 0
اردیبهشت ۱۰, ۱۳۹۶ 0