Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Apprendre Inclinaison des Éléments pour des Conceptions Uniques | Transformation des éléments avec CSS
Techniques CSS Avancées

bookInclinaison des Éléments pour des Conceptions Uniques

skew() permet de dévier les côtés d’un élément par rapport aux axes de coordonnées selon un angle spécifique. L’angle doit être indiqué en degrés (deg). Il est également possible de définir la déformation uniquement pour l’axe x ou l’axe y. La syntaxe est la suivante :

transform: skew(X_angle, Y_angle);
transform: skewX(angle);
transform: skewY(angle);
  • skew() accepte 2 valeurs. La valeur X_angle définit l’angle de déformation pour l’axe x. La valeur Y_angle définit l’angle de déformation pour l’axe y. Si la seconde valeur (Y_angle) n’est pas définie, le navigateur l’interprète comme skewX() ;
  • skewX(angle) définit la déformation selon l’axe x ;
  • skewY(angle) définit la déformation selon l’axe y.

Considérer l’exemple suivant pour observer les résultats obtenus grâce à la déformation :

index.html

index.html

index.css

index.css

copy
question mark

Sélectionner l’énoncé correct.

Select the correct answer

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 5. Chapitre 6

Demandez à l'IA

expand

Demandez à l'IA

ChatGPT

Posez n'importe quelle question ou essayez l'une des questions suggérées pour commencer notre discussion

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

bookInclinaison des Éléments pour des Conceptions Uniques

Glissez pour afficher le menu

skew() permet de dévier les côtés d’un élément par rapport aux axes de coordonnées selon un angle spécifique. L’angle doit être indiqué en degrés (deg). Il est également possible de définir la déformation uniquement pour l’axe x ou l’axe y. La syntaxe est la suivante :

transform: skew(X_angle, Y_angle);
transform: skewX(angle);
transform: skewY(angle);
  • skew() accepte 2 valeurs. La valeur X_angle définit l’angle de déformation pour l’axe x. La valeur Y_angle définit l’angle de déformation pour l’axe y. Si la seconde valeur (Y_angle) n’est pas définie, le navigateur l’interprète comme skewX() ;
  • skewX(angle) définit la déformation selon l’axe x ;
  • skewY(angle) définit la déformation selon l’axe y.

Considérer l’exemple suivant pour observer les résultats obtenus grâce à la déformation :

index.html

index.html

index.css

index.css

copy
question mark

Sélectionner l’énoncé correct.

Select the correct answer

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 5. Chapitre 6
some-alt