CSS3之 transform-origin
-----------------变形原点,该元素围绕着哪个点变形或者旋转,配合着transform属性一起用。
1、语法:
transform-origin: x-axis y-axis z-axis;
2、取值:
默认值为 50% 50% 0
3、兼容性:
注释:
- Internet Explorer supports an alternative, the -ms-transform-origin property, but only for 2D-transforms.
- Firefox supports an alternative, the -moz-transform-origin property, but only for 2D-transforms.
- Opera supports an alternative, the -o-transform-origin property, but only for 2D-transforms.
- Safari and Chrome supports an alternative, the -webkit-transform-origin property, on both 2D- and 3D-transfoms.
#test{
transform-origin: 20% 30%;
-ms-transform-origin: 20% 30%; //IE9
-webkit-transform-origin: 20% 30%; //safari chrome
-moz-transform-origin: 20% 30%; //ff
-o-transform-origin: 20% 30%; //opera
扩展阅读:
1、http://www.w3schools.com/cssref/css3_pr_transform-origin.asp