在本文中,我们将看到 CSS 透视图是如何工作的。 CSS 透视图是一个新的 CSS 属性,必须提供它来管理 z 轴之间的距离。我们都知道我们使用 2D 表面。因此,如果我们旋转对象,则不会显示这种完整性。这个问题的解决方案是我们在 z 轴上看到的 CSS 透视图。
如果光源远离物体,它们就像投影仪一样工作,因此可以在墙上制作大图像。通过将透视属性应用于父元素并在子元素中进行任何看起来像 3D 元素的转换,它们的使用非常简单。
句法:
/* parent div */
perspective: perspective_distance;
/* child div */
transform: value;
如果父 div 应用透视,则子 div 中的任何变换属性都适用,因此它们表现为 3D 对象
示例 1:以下示例不使用透视图进行说明。
HTML
HTML
输出:
示例 2:以下示例说明了 Perspective 的使用。
HTML
输出: