transform

语法：

transform：none | matrix(<number>,<number>,<number>,<number>,<number>,<number>)? translate(<length>[,<length>])? translateX(<length>)? translateY(<length>)? rotate(<angle>)? scale(<number>[,<number>])? scaleX(<number>)? scaleY(<number>)? skew(<angle>[,<angle>])? skewX(<angle>) || skewY(<angle>)?

默认值：none

适用于：所有块级元素及某些内联元素

继承性：无

取值：

none：
无转换
matrix(<number>,<number>,<number>,<number>,<number>,<number>)：
以一个含六值的(a,b,c,d,e,f)变换矩阵的形式指定一个2D变换，相当于直接应用一个[a,b,c,d,e,f]变换矩阵
translate(<length>[, <length>])：
指定对象的2D translation（2D平移）。第一个参数对应X轴，第二个参数对应Y轴。如果第二个参数未提供，则默认值为0
translateX(<length>)：
指定对象X轴（水平方向）的平移
translateY(<length>)：
指定对象Y轴（垂直方向）的平移
rotate(<angle>)：
指定对象的2D rotation（2D旋转），需先有transform-origin属性的定义
scale(<number>[, <number>])：
指定对象的2D scale（2D缩放）。第一个参数对应X轴，第二个参数对应Y轴。如果第二个参数未提供，则默认取第一个参数的值
scaleX(<number>)：
指定对象X轴的（水平方向）缩放
scaleY(<number>)：
指定对象Y轴的（垂直方向）缩放
skew(<angle> [, <angle>])：
指定对象skew transformation（斜切扭曲）。第一个参数对应X轴，第二个参数对应Y轴。如果第二个参数未提供，则默认值为0
skewX(<angle>)：
指定对象X轴的（水平方向）扭曲
skewY(<angle>)：
指定对象Y轴的（垂直方向）扭曲

说明：

设置或检索对象的转换。
  • 对应的脚本特性为transform。

兼容性：

  • 浅绿 = 支持
  • 红色 = 不支持
  • 墨绿 = 部分支持
  • 橙色 = 实验性质
支持版本\类型 IE Firefox Safari Chrome Opera
版本 6-8 4-18 5.1.7 13-23 11.5-12.5
版本 9-10

示例：