scaleZ() function
Specifies a scale operation using the [1,1,sz] scaling vector, where sz is given as the parameter.
![]() ![]() |
Syntax
scaleZ
(
<scaling-value-z>
)
Parameters
- scaling-value-z
-
Numerical value by which to scale the specified element in the z-direction.
Standards information
- CSS Transforms Module, Level 3, Section 13.2
Remarks
The effect of the scaleZ function is most evident when used in combination with functions such as the perspective and rotate (and related) functions.
Examples
The following code snippet is an example of the scaleZ function in use. When applied to a square blue div element along with the perspective function (which simulates depth) and the rotateX function, it has the effect illustrated in the image. (The light-blue square indicates the original position of the transformed element.)
div {
transform: perspective(500px) scaleZ(2) rotateX(45deg);
}

See also
- Transform Functions
- Mathematical Description of Transform Functions
- Direct3D: Matrices
- Hands On: 3-D Transforms
Show:

