我们都在网页上见过一些效果,比如写一个点击事件会旋转的动画,里面有延迟, 这是css3旋转效果.在css3中有几个常用的属性 transform应用,里面常用的几 种:旋转rotate,扭曲skew,缩放scale和移动translate。本文主要讲解css3里 面的920度旋转及缩放和放大。
1.旋转rotate() :通过指定的角度参数对原元素指定一个2D rotation (2D旋转)，angle是指旋转角度,如果设置的值为正数表示顺时针旋转,负数则表示逆时针旋转。如: transform:rotate(920deg)。
2.缩放scale([,]):提供执行[sx,sy]缩放矢量的两个参数指定一个2D scale (2D缩放) 。如果第二个参数未提供，则取与第一个参数一 样的值。 scale(X,Y)是用于对元素进行缩放，可以通过transform-origin对元素的基点进行设置，同样基点在元素中心位置;基中X表示水平方向缩放的倍数，Y表示垂直方向的缩放倍数，而Y是一个可选参数,如果没有设置Y值，则表示X, Y两个方向的缩放倍数是一样的。并以X为准。
如: transform:scale(2,1.5)。
3.移动translate([,]) :通过矢量[tx, ty]指定一个2D translation, tx 是第一个过渡值参数, ty 是第二个过渡值参数选项。如果未被提供,则ty以0作为其值。也就translate(x,y),它表示对象进行平移, 按照设定的x,y参数值,当值为负数时，反方向移物体，其基点默认为元素中心点,也可以根据transform-origin进行改变基点。
如:transform:translate(200px)。
举例
