Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Skewing | Transformations
Advanced CSS Techniques
course content

Зміст курсу

Advanced CSS Techniques

Advanced CSS Techniques

1. Introduction
2. Item Positioning
3. Transitions
4. Animations
5. Transformations
6. Adaptive/responsive websites and apps
7. Preprocessors

Skewing

skew() allows us to deviate an element's sides to the coordinate axes on a specific angle. The angle must be specified in degrees (deg). Also, we can determine the skew only for the x-axis or y-axis. The syntax is following:

  • skew() accepts 2 values. The X_angle value specifies the skew angle for the x-axis. The Y_angle value specifies the skew angle for the y-axis. If we don't set the second value (Y_angle), the browser understands it as skewX();
  • skewX(angle) specifies the skew along the x-axis;
  • skewY(angle) specifies the skew along the y-axis.

Let's run the following example to see what we can get with the help of skewing:

html

index

css

index

js

index

Select the correct statement.

Виберіть правильну відповідь

Все було зрозуміло?

Секція 5. Розділ 6
We're sorry to hear that something went wrong. What happened?
some-alt