如何在CSS中计算Z轴

Question

我的目标是在应用z轴后使用scale((将所有内容恢复到原始大小。

我有一个具有任意视角的包装器：

.wrapper {
width: 100vw;
height: 100vh;
overflow-y: auto; 
overflow-x: hidden;
perspective: 10px;
}

然后我会有层例如：

.layer_00 {
transform: translateZ(-20px) scale(???); /* Farthest away and slowest */
}
.layer_01 {
transform: translateZ(12px) scale(???); /* On top and quick */
}
.layer_02 {
transform: translateZ(3px) scale(???); /* In between and medium pace */
}

我的数学真的很差，但我想学这个。

Answer 1

好的，下面的内容似乎有效。

(perspective - translateZ) / perspective = scale

但如果它们是通过translateX和translateY定位的，那么它们需要乘以比例。