css3D制作立体旋转小方块

 

用到的重要css样式：

1、transform:perspective( )；

        perspective 属性定义 3D 元素距视图的距离，以像素计。该属性允许您改变 3D 元素查看 3D 元素的视图。

当为元素定义 perspective 属性时，其子元素会获得透视效果，而不是元素本身。

2、transform-style: preserve-3d;

        用于将子元素将保留其 3D 位置。

3、transform: translatez( );

        定义3D 转换,只是用 Z 轴的值，定义距离。

 下面是具体的实例：

	
	
	
	
	


	

		
1
		
2
		
3
		
4
		
5
		
6
	

 效果图如下：