Sunny Books
What we have

CSS3 3D transforms

CSS3 allows us to format the elements using 3D transforms such as rotate3d, rotateX, rotateY, rotateZ, translateX, translateY, translateZ, scale3d, scaleX, scaleY, scaleZ, etc.

The rotateX(), rotateY(), and rotateZ() methods

The rotateX() method rotates the element around its X-axis at a given degree. The rotateY() method rotates the element around its Y-axis at a given degree. The rotateZ() method rotates the element around its Z-axis at a given degree.

Examples (hover on the box)

rotateX
rotateY
rotateZ

The translateX(), translateY(), and translateZ() methods

Examples (hover on the box)

translateX
translateY


The scaleX(), tscaleY(), and scaleZ() methods

Examples (hover on the box)

scaleX
scaleY


A Cube example (click the text below)

This example does not work for Internet Explorer.

Image 1 Image 2 Image 3 Image 4

Click me to toggle transparency

SUNWEB EXPERT