CSS#提供的变形支持

标签：

transform:该属性设置HTML组件横向上移动tx距离，纵向上移动ty距离。其中ty参数可以省略，如果省略ty参数，则ty默认为0

• translate(tx,ty)：该函数设置HTML组件横向上移动tx个距离，纵向上移动ty距离。
• translateX：该函数设置HTML组件横向上移动tx个距离。
• translateY：该函数设置HTML组件横向上移动ty距离。
• scale(sx,sy):该函数设置HTML组件横向上缩放比例为sx，纵向上缩放比例为sy。
• scaleX:
• scaleY:
• rotate(angle):该函数设置HTML组件顺时针转过angle角度。
• skew(sx,sy)：该函数设置HTML组件沿着X轴倾斜sx角度，沿着Y轴倾斜sy角度。
• skewX：
• skewY:
• matrix:(m11,m12,m21,m22,dx,dy):这是一个基于矩形变换的函数。其中前面四个参数将组成变形矩阵；dx,dy将负责对坐标系统进行平移。

transform-origin:该属性设置变形的中心点。该属性值应该制定为xCenter yCenter,其中xCenter、yCenter支持如下几种属性

• left:制定旋转中心点位于HTML组件的左边界。该属性值只能制定为xCenter。
• top：
• right:
• bottom:
• center:指定旋转中心点位于HTML组件的中间。如果将xCenter,yCenter都指定为center，则旋转中心点位于HTML元素的中心。
• 长度值：指定旋转中心点距离左边界、右边界长度
• 百分比：指定旋转中心点位于横向、纵向上的百分比

CSS#提供的变形支持

标签：

原文地址：http://www.cnblogs.com/yhq361/p/4249203.html