تابع CSS translateY()

تعریف و استفاده

CSS translateY() تابع امکان می‌دهد تا عنصر را در محور y (محور عمودی) دوباره مکان‌دهی کنید.

translateY() تابع در تبدیل در استفاده از ویژگی‌ها.

مثال

با استفاده از محور عمودی، عناصر مختلف <div> را دوباره مکان‌دهی کنید:

#myDiv1 {
  transform: translateY(30px); /* حرکت عنصر به سمت بالا 30px در محور y */
}
#myDiv2 {
  transform: translateY(50px); /* حرکت عنصر به سمت بالا 50px در محور y */
}
#myDiv3 {
  transform: translateY(-10px); /* حرکت عنصر به سمت پایین 10px در محور y */
}

آزمایش کنید

نوع دستور CSS

translateY(y)
مقدار توضیحات
y لازم است. تعریف فاصله حرکت عنصر در محور y، می‌تواند عدد یا درصد باشد.

جزئیات فنی

نسخه: مودول تبدیل‌های CSS سطح 1

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

اعداد در جدول نشان‌دهنده نسخه اولیه مرورگرهایی هستند که این تابع را کامل پشتیبانی می‌کنند.

کروم ایج فایرفاکس سافاری آپرا
1 12 3.5 3.1 10.5

صفحات مرتبط

درس:CSS 2D تبدیل

مطالعه:CSS transform کی خاصیت

مطالعه:CSS translate() فنکشن

مطالعه:CSS translateX() فنکشن

مطالعه:HTML DOM transform کی خاصیت