web移动第二天

空间转换

透视

• perspective

空间旋转

• transform：rotateX()
• transform：rotateY()
• transform：rotateZ()
• transform：rotate3D(X，Y，Z)
• 判断方向方向：左手定则

3D立体视角

• transform-style: preserve-3d;

动画

定义动画

• @keyframes _ (命名，不能带中文)

  • @keyframes move { from{ } to{ }

  • @keyframes move { 0% { }

  20%{ }

使用动画animation

• 匀速：linear
• 无线播放：infinite
• 反向动画alternate
• 动画停留在结束位置 forwards
• animation-delap 动画延迟
• animation-play-state:paused; 暂停动画

\