CSS - Transformaciones 3D

Usando transformaciones 3d, podemos mover el elemento al eje x, eje y y eje z. El siguiente ejemplo especifica claramente cómo rotará el elemento.

Métodos de transformaciones 3D

Los siguientes métodos se utilizan para llamar a las transformaciones 3D:

No.Valor y descripción
1matrix3d(n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n)

Se utiliza para transformar el elemento mediante el uso de 16 valores de matriz

2translate3d(x,y,z)

Se utiliza para transformar el elemento utilizando el eje x, el eje y y el eje z

3translateX(x)

Se usa para transformar el elemento usando el eje x

4translateY(y)

Se usa para transformar el elemento usando el eje y

5translateZ(z)

Se usa para transformar el elemento usando el eje y

6scaleX(x)

Usado para escalar transforma el elemento usando el eje x

7scaleY(y)

Usado para escalar transforma el elemento usando el eje y

8scaleY(y)

Se usa para transformar el elemento usando el eje z

9rotateX(angle)

Usado para rotar transforma el elemento usando el eje x

10rotateY(angle)

Usado para rotar transforma el elemento usando el eje y

11rotateZ(angle)

Usado para rotar transforma el elemento usando el eje z

Transformaciones 3D del eje X

El siguiente ejemplo muestra las transformaciones 3D del eje x.

Transformaciones 3D del eje Y

El siguiente ejemplo muestra las transformaciones 3D del eje y:

Transformaciones 3D del eje Z

El siguiente ejemplo muestra las transformaciones 3D del eje Z: