10 09/2014

pure css 3d cube

最后更新: Wed Sep 10 2014 12:29:11 GMT+0800

 






三维

  • 拼立体方块:6个div(100x100),各自 向前(translateZ)一步(边长100的一半,50),然后4个90度向4个方向转,一个转180到背后。那个写着“三维”的div原地没动!
  • 外面 #cube 容器做动画:旋转360度

html 代码

<div id="cube" class="animate">
<div>&nbsp;</div>
<div>郭</div>
<div>爽</div>
<div>在</div>
<div>此</div>
<div></div>
<div>三维</div>
</div>

看看 css 代码