From the course: CSS: Transforms and Transitions
Join today to access over 22,600 courses taught by industry experts or purchase this course individually.
Rotations and scaling in 3D - CSS Tutorial
From the course: CSS: Transforms and Transitions
Rotations and scaling in 3D
- [Instructor] In the last video, you were introduced to the CSS 3D virtual space. In this video, we'll learn about 3D transformations that allow us to work with the object in that space. Let's start by looking at rotations in three dimensions. In this demo page, I've given you two views of the page object. The three-quarter view is there to help you visualize the 3D virtual space in which the object resides. The user view shows you what the user would see on his or her screen. CSS supports four rotation transformation functions for rotating the object around the x-axis, around the y-axis, or around the z-axis. You can also rotate the object around any line defined by a three-dimensional vector. CSS also supports four translation functions for moving the object in three-dimensional space, once again, along the x-axis, along the y-axis, and along the z-axis. Or, using the translate3d function, moving the object to any position within the 3D space, defined by x-y-z coordinate. And…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Download courses and learn on the go
Watch courses on your mobile device without an internet connection. Download courses using your iOS or Android LinkedIn Learning app.