Author: 刘老师(Aaron Lau)
武汉长乐教育,武汉PHP培训课程,版权所有,转载请注明!
CSS3 3D transform 变换
课程概要
- 基础概念
- 详细讲解
CSS3的3D变换, 有一定难度...
1. 基础概念
transform-style:flat(默认,二维效果) / preserve-3d(三维效果)。
translate3d(x,y,z) 使元素在这三个纬度中移动,也可以分开写,如:translateX(length),translateY(length), translateZ(length)。注意z轴的值只能为px;
scale3d(number,number,number) 使元素在这三个纬度中缩放,也可分开写,如:scaleX(),scaleY(),scaleY()。
rotateX(angle) 是元素依照x轴旋转;
rotateY(angle) 是元素依照y轴旋转;
rotateZ(angle) 是元素依照z轴旋转。
perspective(length) 景深, 就是你在多远的地方观看.
2. 详细讲解
猛击这里
案例展示