CSS also supports 3D transformations.

EXAMPLE:

Define some text as keyboard input in a document:

<p>Save the document by pressing <kbd>Ctrl + S</kbd></p>

RESULT:

Save the document by pressing Ctrl + S

CSS 3D Transforms Methods

With the CSS transform property you can use the following 3D transformation methods:

- rotateX()
- rotateY()
- rotateZ()

The rotateX() Method

The rotateX() method rotates an element around its X-axis at a given degree:

EXAMPLE:

#myDiv {
transform: rotateX(150deg);
}

The rotateY() method rotates an element around its Y-axis at a given degree:

EXAMPLE:

#myDiv {
transform: rotateY(130deg);
}

The rotateZ() method rotates an element around its Z-axis at a given degree:

EXAMPLE:

#myDiv {
transform: rotateZ(90deg);
}