Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Aprenda Inclinação de Elementos para Designs Exclusivos | Transformando Elementos com CSS
Técnicas Avançadas de CSS

bookInclinação de Elementos para Designs Exclusivos

skew() permite desviar os lados de um elemento em relação aos eixos de coordenadas em um ângulo específico. O ângulo deve ser especificado em graus (deg). Também é possível determinar o desvio apenas para o eixo x ou y. A sintaxe é a seguinte:

transform: skew(X_angle, Y_angle);
transform: skewX(angle);
transform: skewY(angle);
  • skew() aceita 2 valores. O valor X_angle especifica o ângulo de inclinação para o eixo x. O valor Y_angle especifica o ângulo de inclinação para o eixo y. Se não definirmos o segundo valor (Y_angle), o navegador entende como skewX();
  • skewX(angle) especifica a inclinação ao longo do eixo x;
  • skewY(angle) especifica a inclinação ao longo do eixo y.

Veja o exemplo a seguir para observar os resultados possíveis ao aplicar o skew:

index.html

index.html

index.css

index.css

copy
question mark

Selecione a afirmação correta.

Select the correct answer

Tudo estava claro?

Como podemos melhorá-lo?

Obrigado pelo seu feedback!

Seção 5. Capítulo 6

Pergunte à IA

expand

Pergunte à IA

ChatGPT

Pergunte o que quiser ou experimente uma das perguntas sugeridas para iniciar nosso bate-papo

Awesome!

Completion rate improved to 2.04

bookInclinação de Elementos para Designs Exclusivos

Deslize para mostrar o menu

skew() permite desviar os lados de um elemento em relação aos eixos de coordenadas em um ângulo específico. O ângulo deve ser especificado em graus (deg). Também é possível determinar o desvio apenas para o eixo x ou y. A sintaxe é a seguinte:

transform: skew(X_angle, Y_angle);
transform: skewX(angle);
transform: skewY(angle);
  • skew() aceita 2 valores. O valor X_angle especifica o ângulo de inclinação para o eixo x. O valor Y_angle especifica o ângulo de inclinação para o eixo y. Se não definirmos o segundo valor (Y_angle), o navegador entende como skewX();
  • skewX(angle) especifica a inclinação ao longo do eixo x;
  • skewY(angle) especifica a inclinação ao longo do eixo y.

Veja o exemplo a seguir para observar os resultados possíveis ao aplicar o skew:

index.html

index.html

index.css

index.css

copy
question mark

Selecione a afirmação correta.

Select the correct answer

Tudo estava claro?

Como podemos melhorá-lo?

Obrigado pelo seu feedback!

Seção 5. Capítulo 6
some-alt