Chuyển đổi phần tử bằng cách sử dụng trục x, trục y và trục z với CSS3

Sử dụng phương thức translate3d (x, y, z) để biến đổi phần tử bằng cách sử dụng trục x, trục y và trục z.

Hãy cho chúng tôi xem cú pháp

translate3d(tx, ty, tz)

tx :Nó là một đại diện cho abscissa của vectơ tịnh tiến.
ty :Nó là <độ dài> đại diện cho hoành độ của vectơ tịnh tiến.
tz :Nó là một <độ dài> đại diện cho thành phần z của vectơ tịnh tiến.
Hãy để chúng tôi xem một ví dụ

div {
   width: 50px;
   height: 50px;
   background-color: orange;
}
.trans {
   transform: perspective(300px) translate3d(15px, 0, 0px);
   background-color: black;
}