CSS3 transform-origin 属性
实例
置:
div
{
transform: rotate(45deg);
transform-origin:20% 40%;
-ms-transform: rotate(45deg); /* IE 9 */
-ms-transform-origin:20% 40%; /* IE 9 */
-webkit-transform: rotate(45deg); /* Safari 和 Chrome */
-webkit-transform-origin:20% 40%; /* Safari 和 Chrome */
-moz-transform: rotate(45deg); /* Firefox */
-moz-transform-origin:20% 40%; /* Firefox */
-o-transform: rotate(45deg); /* Opera */
-o-transform-origin:20% 40%; /* Opera */
}
Internet Explorer 支持 -ms-transform-origin 限于 2D 转换。
Firefox 支持 -moz-transform-origin 限于 2D 转换。
Opera 支持 -o-transform-origin 限于 2D 转换。
Safari 和 Chrome 支持 -webkit-transform-origin 适用于 2D 和 3D 转换。
transform-origin 。
2D x 和 y 轴。3D 能改变其 Y 轴。
理解 transform-origin 看这个演示。
Safari/Chrome transform-origin 属性用于 3D 个演示。
注释:与 transform 用。
理解 transform 看这个演示。
| 默认值: | 50% 50% 0 |
|---|---|
| 继承性: | no |
| 版本: | CSS3 |
| JavaScript 语法: | object.style.transformOrigin="20% 40%" |
语法
transform-origin: x-axis y-axis z-axis;
| 值 | 描述 |
|---|---|
| x-axis |
置于 X
|
| y-axis |
置于 Y
|
| z-axis |
置于 Z
|