transform3D和动画的使用

319 阅读1分钟
  • 透视属性 perspective属性值的最优取值范围800-1200px,他是屏幕到眼睛的距离。需要加给父级
  • 立体呈现:transform-style:preserve-3d; ----> 开启3D效果,给父级添加,作用于子级,让子级开启3D效果 transform3d:属性
  • translate3d(x,y,z); image.png
  • rotate3d(x,y,z, 角度deg);其中如果要让x轴旋转,要把x改为1,左手定则判断旋转的正负值 image.png
  • scale3d(x,y,z) image.png
  • 动画的应用 如: 定义动画

image.png

调用动画:

image.png

调用动画的属性值有:

image.png

image.png