码迷,mamicode.com
首页 > 其他好文 > 详细

立体透视 perspective transform-style 倾斜旋转

时间:2016-05-29 10:47:34      阅读:187      评论:0      收藏:0      [点我收藏+]

标签:

1.perspective 是设置镜头距离,距离越远视图越小,视图越近,视图越大。就像相机焦距一样。其只对子元素产生效果.

2.transform-style: preserve-3d 设置3d效果,也是只对子元素产生效果。

3. 倾斜的视图,并且旋转,最开始我以为要对坐标系统进行旋转,其实不然。设置联合动画就行。

	@keyframes Rotate{
				/*//联合作用才会产生效果*/
				from{transform:rotateZ(-30deg) rotateY(0);}
				to{transform:rotateZ(-30deg) rotateY(360deg);}
			}

只对下图的整个球进行旋转就行,其余圆形通过透视产生3d效果

技术分享

立体透视 perspective transform-style 倾斜旋转

标签:

原文地址:http://www.cnblogs.com/yqlog/p/5538950.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!