认识
3D位移
translate3d
1、沿着Z轴移动
2、后面的单位一般跟px
3、translateZ(100px) 向外移动100px
4、简写
5、xyz不可以省略，没有写0
3D旋转
rotateX
旋转的时候 加上透视 ， 会好看一点
rotateY
rotateZ
rotate3d(x,y,z)
透视
- 若想要在网页产生3D效果需要透视
- 透视也称为 视距，视距就是人的眼睛到屏幕的距离
- 距离视觉点越近的在电脑平面成像越大，越远成像越小 （近大远小）
- 透视的单位是像素
透视写在被观察元素的父盒子上面
translateZ
写到被观察的元素身上
在透视固定的情况下，translateZ越大，物体越大
3D呈现 transform-style
代码写给父级 ， 影响的是子盒子
默认的是子元素不开启3d立体空间 -- transform-style:flat
想给子元素也开启3d立体空间 ： transform-style: preserve-3d
浏览器私有前缀
是为了兼容老版本的写法，比较新版本的浏览器无须添加
1、私有前缀
- -moz- ： ‘代表 火狐浏览器私有属性
- -ms- ： 代表 ie浏览器私有属性
- -webkit- ： 代表safari ，谷歌私有属性
- -o- ： 代表 opera私有属性
提倡的写法
