perspective 该perspectiveCSS属性决定在z=0平面和用户之间的距离以便使所述3D定位的元素一些透视效果。z>0的每个3D元素变大;,每个z<0的三维元素则变小。
perspective() 该perspective()CSS函数定义了设置用户和在z=0平面之间的距离的变换。其结果是<transform-function>数据类型。
该perspective-originCSS属性决定了观察者所处的位置。它被perspective属性用作消失点(vanishingpoint)。
参考 CSS属性 backface-visibility perspective perspective-origin transform transform-box transform-origin
它们缩小的速度是由perspective属性定义的。值越小,视角越深。 [表格] [表格] 第二个要配置的元素是查看器的位置和perspective-origin属性。
Homogeneouscoordinatesonℝℙ3||
实例
沿着y轴旋转
HTML
透视 perspective()设置用户和z=0平面之间的距离。 旋转 rotate()围绕2D平面上的一个固定点旋转一个元素。rotate3d()在3D空间中围绕固定轴旋转元素。
记住 虽然使用变换样式(如rotateY,,rotateX等)确保了变换样式perspective已到位。目前,如果没有它,某些动画可能无法在Android上呈现。下面的例子。

扫码关注腾讯云开发者
领取腾讯云代金券
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号:粤B2-20090059
粤公网安备44030502008569号
腾讯云计算(北京)有限责任公司 京ICP证150476号 | 京ICP备11018762号
