css3 3d图片旋转动画-CSS33D旋转图片六面体特效

在H5中，我们将学习一些3D的动画特效。 3D动画特效有哪些？ 动画是将元素从一种风格逐渐改变为另一种风格的效果。 您可以根据需要多次更改样式。

他的作用是通过CSS3我们可以制作动画，可以代替很多网页中的动画图片、Flash动画、JavaScript。

那么如何才能达到这样的疗效呢。 第一个是将我们的页面css3 3d图片旋转动画，即舞台变成3D舞台，而不是在通常的平面上进行。

通过设置transform-style：preserve-3d； 父元素上的属性css3 3d图片旋转动画，可以将舞台转变成3D，所以先解释一下3D舞台的X、Y、Z轴。 就像我们在平面上听到的一样，X轴仍然是从左到右，Y轴是从下到上，所以Z轴分别垂直于X和Y轴，它的方向是从后面通过显示器的显示。 我们的线路之一。 X、Y 和 Z 轴都有方向。 这和我们后期属性值的大小有关。 正值表示朝正方向移动，负值表示朝相反方向移动。

所以让我先记下一些属性。

3D 位移：

变换：translate3d(x,y,z);

翻译X()

翻译Y()

翻译Z（不能是比率）

3D的旋转：
    transform:rotate();
        rotateX()
        rotateY()
        rotateZ()  //默认情况效果类似
        rotate3D(x,y,z,a)   [ 0不旋转。1旋转 ]
            - x：是一个0到１之间的数值，主要用来描述元素围绕X轴旋转的矢量值；
            - y：是一个0到１之间的数值，主要用来描述元素围绕Y轴旋转的矢量值；
            - z：是一个0到１之间的数值&