Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Leer Elementen Schuin Trekken voor Unieke Ontwerpen | Elementen Transformeren met CSS
Geavanceerde CSS-Technieken

bookElementen Schuin Trekken voor Unieke Ontwerpen

skew() maakt het mogelijk om de zijden van een element ten opzichte van de coördinaatassen met een specifieke hoek af te wijken. De hoek moet worden opgegeven in graden (deg). Daarnaast kan de skew alleen voor de x-as of y-as worden bepaald. De syntaxis is als volgt:

transform: skew(X_angle, Y_angle);
transform: skewX(angle);
transform: skewY(angle);
  • skew() accepteert 2 waarden. De waarde X_angle bepaalt de skew-hoek voor de x-as. De waarde Y_angle bepaalt de skew-hoek voor de y-as. Als de tweede waarde (Y_angle) niet wordt opgegeven, interpreteert de browser dit als skewX();
  • skewX(angle) bepaalt de skew langs de x-as;
  • skewY(angle) bepaalt de skew langs de y-as.

Bekijk het volgende voorbeeld om te zien wat er met skewing mogelijk is:

index.html

index.html

index.css

index.css

copy
question mark

Selecteer de juiste bewering.

Select the correct answer

Was alles duidelijk?

Hoe kunnen we het verbeteren?

Bedankt voor je feedback!

Sectie 5. Hoofdstuk 6

Vraag AI

expand

Vraag AI

ChatGPT

Vraag wat u wilt of probeer een van de voorgestelde vragen om onze chat te starten.

Suggested prompts:

Can you show me an example of how skew() works in CSS?

What is the visual effect of skewing an element?

How do skewX() and skewY() differ in their results?

Awesome!

Completion rate improved to 2.04

bookElementen Schuin Trekken voor Unieke Ontwerpen

Veeg om het menu te tonen

skew() maakt het mogelijk om de zijden van een element ten opzichte van de coördinaatassen met een specifieke hoek af te wijken. De hoek moet worden opgegeven in graden (deg). Daarnaast kan de skew alleen voor de x-as of y-as worden bepaald. De syntaxis is als volgt:

transform: skew(X_angle, Y_angle);
transform: skewX(angle);
transform: skewY(angle);
  • skew() accepteert 2 waarden. De waarde X_angle bepaalt de skew-hoek voor de x-as. De waarde Y_angle bepaalt de skew-hoek voor de y-as. Als de tweede waarde (Y_angle) niet wordt opgegeven, interpreteert de browser dit als skewX();
  • skewX(angle) bepaalt de skew langs de x-as;
  • skewY(angle) bepaalt de skew langs de y-as.

Bekijk het volgende voorbeeld om te zien wat er met skewing mogelijk is:

index.html

index.html

index.css

index.css

copy
question mark

Selecteer de juiste bewering.

Select the correct answer

Was alles duidelijk?

Hoe kunnen we het verbeteren?

Bedankt voor je feedback!

Sectie 5. Hoofdstuk 6
some-alt