Recomendaciones de curso:

Función skew() de CSS

Definición y uso skew() En CSS

skew() La función se utiliza para inclinar los elementos en el eje x e y según el ángulo especificado. transform Usado en la propiedad.

Ejemplo

Ejemplo 1

Uso skew() Inclinar varios elementos <div>:

#myDiv1 {
  transform: skew(15deg);
}
#myDiv2 {
  transform: skew(15deg, 15deg);
}
#myDiv3 {
  transform: skew(-15deg);
}

Prueba por tu cuenta

Ejemplo 2

Uso skew() Imágenes inclinadas:

#img1 {
  transform: skew(25deg);
}
#img2 {
  transform: skew(-25deg);
}
#img3 {
  transform: skew(10deg, 10deg);
}

Prueba por tu cuenta

Sintaxis CSS

skew(ax, ay)
Valor Descripción
ax Obligatorio. Ángulo. Especifica la inclinación a lo largo del eje x.
ay Opcional. Ángulo. Especifica la inclinación a lo largo del eje y. Si se omite, se establece en 0.

Detalles técnicos

Versión: Módulo de Transformaciones CSS Nivel 1

Compatibilidad del navegador

El número en la tabla representa la versión del navegador que admite completamente la función por primera vez.

Chrome Edge Firefox Safari Opera
1 12 3.5 3.1 10.5

Páginas relacionadas

Tutoriales:Transformaciones 2D de CSS

Referencia:Atributo transform de CSS

Referencia:Función skewX() de CSS

Referencia:Función skewY() de CSS