Generador de CSS Transform para gente perezosa.
Establezca la escala, gire, traslade y sesgue y vea la vista previa en vivo para obtener la vista deseada.
Evite establecer valores extremos para la propiedad de sesgo porque la vista previa puede cubrir el panel de configuración. En esta situación, deberá actualizar la página.
Escalar, rotar, trasladar y sesgar
La escala funciona como si acercarías y alejarías el elemento objetivo. El valor de escala predeterminado es 1, que funciona como un multiplicador del tamaño original. Esto significa que 0.5 reduce a la mitad mientras que 2 duplica la sección.
Gire el elemento en el sentido de las agujas del reloj con la segunda propiedad que se establece en grados. Girar 180 ° pone el objeto boca abajo, mientras que 360 ° vuelve a su posición vertical original. Establezca cualquier valor positivo o negativo o incluso decimales.
Traducir desplaza el elemento con píxeles relacionados con su posición original. El valor de X horizontalmente mientras que Y verticalmente cuando hay un atributo de rotación es cero.
Inclina los objetos en su eje horizontal (X) o vertical (Y).
Transformación CSS explicada
La propiedad CSS de transformación le permite rotar, escalar, sesgar y traducir un elemento. Modifica el espacio de coordenadas del modelo de formato visual CSS.
Definición y uso
La propiedad de transformación aplica una transformación 2D o 3D a un elemento. Esta propiedad le permite rotar, escalar, mover, sesgar, etc. elementos.
Soporte del navegador
Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con la propiedad.
Los números seguidos de -webkit-, -moz- o -o- especifican la primera versión que funcionó con un prefijo.
Sintaxis
transform: none|transform-functions|initial|inherit;
