码迷,mamicode.com
首页 > Web开发 > 详细

CSS3-transform

时间:2020-06-17 12:26:56      阅读:49      评论:0      收藏:0      [点我收藏+]

标签:style   spec   属性   一个   理解   父类   支持   否则   图片   

因为需求是让一个半球体状的图片变成可以旋转的摄像头,想了很久也试了很多方法当然和博主菜有关

下面就发现一种方法:

css3的视角改变-perspective(number|none):none的时候就是没有透视

可能你会问到透视是什么了,透视就是emmm,你能否透过现象看本质,也就是你的视角是从哪里开始的,姑且就这么理解吧。

但是这个属性其实现在各大浏览器都是不支持的,目前只有chrome和Safari 两个浏览器支持-webkit-perspective 

具体怎么使用呢?

在设置子类动画时,需要向父类动画上添加perspective和transform-style:perserve-3d(3d效果),否则是不会实现的。

然后这个效果可以制作星球旋转和绕着太阳系旋转等等动画。

CSS3-transform

标签:style   spec   属性   一个   理解   父类   支持   否则   图片   

原文地址:https://www.cnblogs.com/yrxl/p/13151719.html

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