css3d旋转

一、包裹层添加

  -webkit-perspective: 800px;
  -moz-perspective: 800px;

　使子元素获得3D效果支持

 

二、自持子元素需支持3D效果

-webkit-transform-style: preserve-3d;
-webkit-transition: all 0.6s;
-moz-transform-style: preserve-3d;
-moz-transition: all 0.6s;

/*当元素不面向屏幕时隐藏*/
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;

三、子元素添加3d效果

-webkit-transform:rotateY(0deg);
  -moz-transform:rotateY(0deg);