CSS33Dtransform变换视差滚动效果学习在学习如何用CSS实现视差滚动效果的时候，看了张新旭老师的文章，记录了学习视差滚动和3Dtransform变换点的几个理解。1.回顾笛卡尔坐标系的概念。下图的Y方向应该是反的。关于笛卡尔坐标系的知识可以在维基百科的笛卡尔坐标下找到。复习了笛卡尔坐标系的方向判断，rotateX,Y,Z就很好理解了。2、之后就是关于perspective属性的内容了。原文下图有点难懂。为什么两种写法会造成这样的差异，这里可以这样理解：如果只给舞台设置perspective属性，相当于只有一个viewer，perspective-origin是初始视点，默认到(50%,50%)，这是在观察平面的中心。所以当只有一个观看者时，面对n个y轴倾斜45°的门，大家可以自己模拟测试，每扇门的观看面积都不一样。还会有一扇门与你转头看的视线平行，从而“消失”。并且给子元素设置了perspective属性后，就相当于每扇门前都有一个你，所以每扇门的可视区域都是一样的。3.视差滚动中scale的计算，画个草图就知道了。perspective是舞台视觉平面升高（朝向您）的距离，translateZ是元素后退（朝向您）的距离，因此scale=|translateZ|/perspective。
