CSS3中transform属性的详解.docxVIP

第

第PAGE1页共NUMPAGES1页

CSS3中transform属性的详解

语法：none|[]*初始值是none。

transform-function函数取值：

matrix():定义矩阵变换。

translate():移动元素对象。

scale():缩放元素对象。

rotate():旋转元素对象。

skew():倾斜元素对象。

例如(兼容扫瞄器)：

1.rotate()函数：transform:rotate(-90deg);-o-transform:rotate(-90deg);-moz-transform:rotate(-90deg);-webkit-transform:rotate(-90deg);filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

2.scale()函数：transform:scale(2);-o-transform:scale(2);-moz-transform:scale(2);-webkit-transform:scale(2);

当为scale传递不同的参数值时，缩放动画效果是不同的。scale(1,2)意思是宽度保持不变，高度变为本来的2倍。scale(1,-2)意思是宽度保持不变，高度变为本来的