translateZ使用set perspective(关键字:"parallax")相对于父级宽度/高度的父容器内部计算子元素的宽度/高度的公式是什么？

我想在两个轴上创建一个具有视差效果的站点.除了一件事,我能够弄清楚我的模型需要的一切.当它超过100%时,如何计算儿童的宽度/高度.由于父母的视角和儿童的翻译,儿童的宽度/高度在视觉上不再与父母的宽度/高度对齐.

用于缩放子元素的公式是:1 + (translateZ * -1) / perspective.但我无法找到宽度/高度的公式.顺便说一句:当孩子的宽度/高度<= 100%时,一切正常.
但是当宽度> = 100%时,请查看下图中的结果(容器具有顶部偏移以使事物可见).

为了正确,在我的特定情况下,方法是让所有子元素在视觉上具有相同的宽度/高度.

在SASS(首选):CSS中的PEN或SassMeister
:PEN

来自可能有用的规范的链接:
https://www.w3.org/TR/css-transforms-1/#recomposing-to-a-3d-matrix
https://www.w3.org/TR/css-变换-1 /#数学-描述

"谷歌搜索"很多,但没有找到任何指向我正确方向的东西.提前致谢...

html, body {
  height: 100%;
  overflow: hidden;
  width: 100%;
}

#projection {
  perspective: 1px;
  perspective-origin: 0 0;
  height: 100%;
  overflow: auto;
  width: 100%;
}

.pro {
  transform: scale(1) translate(0px, 0px) translateZ(0px);
  height: 100%;
  position: absolute;
  transform-origin: 0 0;
  transform-style: preserve-3d;
  width: 100%;
}

.pro--1 { …