transform:rotate()的旋转是指图片本身(原地转向)的旋转,不是图片整体方位的旋转,旋转以后图片的正方向Z轴会跟着图片的正方向变化。 两个例子(主要区别在注释里) 3D导航栏 !!先移动后旋转和先旋转后移动都可以,注意先旋转后方位会出现变化。 结果:鼠标移动在导航栏上出现3D旋转。 3D旋转木马 采用先旋转后移动。如果先移动后旋转,就要先计算好如果采用旋转的新方位,再倒推需要移动的位置,以此位置设置移动距离,再旋转。也就是先想到结果,再倒推位移,记住,此时结果的方位坐标是变化了的。 结果: