CSS | scaleZ()函数

CSS中的scaleZ()函数用于沿z轴缩放元素。它可以将元素按指定比例在z轴方向上缩放，而不影响元素在x、y方向上的大小。

语法

scaleZ()函数的语法如下：

transform: scaleZ(n);

其中，参数n为缩放比例，可以是负值。如果n小于1，则元素在z轴方向缩小；如果n大于1，则元素在z轴方向放大。

示例

下面的示例演示如何使用scaleZ()函数来缩放一个div元素：

div {
  transform: scaleZ(0.5);
}

上面的代码将把div元素沿z轴方向缩小一半。

多个transform函数的组合

scaleZ()函数可以和其他transform函数组合使用，实现更复杂的变换效果。例如：

div {
  transform: translateX(50px) rotateY(45deg) scaleZ(1.5);
}

上面的代码将把div元素向右移动50像素，绕y轴旋转45度，然后沿z轴方向放大一倍。

总结

scaleZ()函数是CSS中用于沿z轴缩放元素的函数。它可以单独使用，也可以和其他transform函数一起组合使用，实现更复杂的变换效果。