50. 3D transforms Reja: 3D ???? 3D

translate3d()
💡
Translate3d - elementni fazoda ko'rsatilgan qiymatlar bo'yicha siljitish uchun 
ishlatiladi
Umumiy ko'rinishi
selector-nomi
{
transform
:
translate3d
(
x-qiymat
,
y-qiymat
,
z-qiymat
);
}
Misol
<
style
>
.box { 

---

50. 3D transforms
5
width: 500px; 
height: 500px; 
background-color: red; 
transform: translate3d(10px, 20px, 30px); 
} 
style
>
--------------------- 
<
div 
class
="
box
">
X o'qi bo'yicha 10px, Y bo'yicha 20px va Z bo'yicha 30pxga siljitish
div
>
💡
"Translate3d"ning yana translateX, translateY va translateZ ko'rinishlari 
ham mavjud
translate3d()
The translate3d() CSS function repositions an element in 3D space. Its result is a data type. This transformation 
is characterized by a three-dimensional vector. Its coordinates define how much the element moves in each 
direction. BCD tables only load in the browser
https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/translate3d()
translateX
The translateX CSS function repositions an element horizontally on 
the 2D plane. Its result is a data type. Is a or representing the 
abscissa of the translating vector. A percentage value refers to the 
https://developer.mozilla.org/en-US/docs/Web/CSS/transform-fu
nction/translateX
translateY
The translateY CSS function repositions an element vertically on 
the 2D plane. Its result is a data type. The value is a or representing 
the ordinate of the translating vector. A percentage value refers to 
https://developer.mozilla.org/en-US/docs/Web/CSS/transform-fu
nction/translateY
translateZ
The translateZ CSS function repositions an element along the z-axis in 3D space, i.e., closer to or farther 
away from the viewer. Its result is a data type. This transformation is defined by a which specifies how far 
inward or outward the element or elements move.
https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/translateZ