为什么变形元素的视角出现倒退？

2018-06-03 15:37:45

我有一个小提琴在这里可以玩。在rotateX和rotateY滑块周围移动以查看。元素中距离您最近的部分较小，而距离较远的部分较大。如果你翻转它使用

transform:rotateZ(180deg);

它看起来是正确的，但我不明白为什么它不看起来正确。

更新

如果你看这个3D立方体，这是有道理的。立方体的变换原点是立方体的中间。

等距

据我所知，这些方法可以按照他们所设想的那样工作，只是它们在等轴测3D中旋转，而没有透视。这将使您的最接近的和更远的边缘具有相同的尺寸，这与真正的3D不同，后者的边缘看起来越小，越接近越大。

要深入了解等轴测投影，请阅读维基百科文章。

如果你想获得旋转角度，你必须将perspective属性添加到你的CSS包含元素。如果您添加-webkit-perspective: 1000px; 在你的第一个小提琴中<body>并在Chrome中查看结果，你会得到像你可能想要的透视3D。

有关该属性的更多信息可以在CSS3转换规范中找到。

链接地址: http://www.djcxy.com/p/12295.html