-
3d场景的设置！查看全部
-
transition 分开写法查看全部
-
多个属性的过渡效果查看全部
-
Y轴的正方向是竖直向下查看全部
-
创建3D场景的准备条件: /*表示的是距离*/ -webkit-perspective:800; /*表示从正中心来观看这个物体*/ -webkit-perspective-origin:50% 50%; /*告诉浏览器我们后面进行的操作是对3D的来进行操作的*/ -webkit-transform-style:-webkit-preserve-3d;查看全部
-
使用的时候还需要添加: -webkit-transform-style:-webkit-preserve-3d;的值来实现3D场景的设置查看全部
-
注意:我们使用rotate来进行旋转的时候,单位是用deg来调试的查看全部
-
如果我们已经创建好了3D场景,那么此时我们就需要使用transform属性来调整元素: 如图查看全部
-
使用perspective和perspective-origin属性来设置3D场景查看全部
-
过渡模式的几种取值: 如图查看全部
-
如果想同时为两个属性设置过渡的效果,我们有两种方法可以来实现: 1.-webkit-transition:<属性1><时间1>,<属性2><时间2>... 2.-webkit-transition:<属性1><时间1>; -webkit-transition:<属性2><时间2>;查看全部
-
我们上面写的是如下的缩写: -webkit-transition-property:background-color; -webkit-transition-duration:3s;查看全部
-
#block{ width:200px; height:200px; background-color:#00F; margin:0 auto; -webkit-transition:background-color 3s ; } #block:hover{ background-color:red; } 如代码所示,我们在使用transition属性的时候很简单的就为背景颜色进行了改变, 也就是说,使用transition属性的时候第一个参数是要改变的是什么参数,那么就可以在使用的时候进行改变查看全部
-
CSS3中的动画功能主要是使用下面两种方法来实现的: transition animation查看全部
-
transform属性也适用于2d场景需要给其加上-webkit-transform-style:-weblit-preserve-3d; transform属性（移动） -translateX（px） -translateY（px） -translateZ（px） -rotate(旋转角度) -rotateX(x deg) -rotateY(y deg) -rotateZ(z deg)查看全部
举报
0/150
提交
取消