Функция skewY

La función skewY establece la inclinación de un elemento a lo largo del eje Y, transformándolo en un paralelogramo. Se utiliza junto con la propiedad transform. El valor de la propiedad es un ángulo en cualquier unidad de medida de ángulos. El ángulo puede ser positivo o negativo. Un valor positivo inclina el elemento hacia arriba, uno negativo - hacia abajo. La inclinación se realiza alrededor del punto definido por la propiedad transform-origin.

Sintaxis

cssselector {
  transform: skewY(ángulo);
}

Ejemplo

En este ejemplo, el bloque está inclinado 30 grados hacia arriba:

html<div id="elem">lorem ipsum</div>

css#elem {
  transform: skewY(30deg);
  border: 1px solid black;
  width: 100px;
  height: 50px;
}

Результат:

Ejemplo

En este ejemplo, el bloque está inclinado 30 grados hacia abajo:

html<div id="elem">lorem ipsum</div>

css#elem {
  transform: skewY(-30deg);
  border: 1px solid black;
  width: 100px;
  height: 50px;
}

Результат:

Véase también