认识CSS3 transform 属性

定义和属性

transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。

注：opela不支持3D转换    IE9以上浏览器支持支持

 

translate3d（x,y,z）  3d平移变化       x y  z  是指平移的像素

 

rotate3d(x,y,z,angle)    3d 旋转    X Y Z取值是在0-1之间  angle=45deg  实际旋转的角度

scale3d（x,y,z,） 3d缩放     x y z取值也是0-1之间

 

其中rotate3d 和scale3d是可以配合着transform-origin（水平方向,垂直方向）来用，只有设置了truansform这个中心点才有用

 

最后再说一下 X   Y  Z的一个大概定义和旋转的情况，这是比较麻烦的因为我没有三维立体的感觉，所以就查阅了各种资料问了朋友才找到的这个~