CSS3 transform-origin 属性

由 胖大叔 创建，youj 最后一次修改 2016-07-22 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 and Chrome */-webkit-transform-origin:20% 40%; /* Safari and Chrome */} 尝试一下 ?浏览器支持表格中的数字表示支持该属性的第一个浏览器版本号。紧跟在 -webkit-, -ms- 或 -moz- 前的数字为支持该前缀属性的第一个浏览器版本号。 属性           transform-origin(two-value syntax) 36.04.0 -webkit- 10.09.0 -ms- 16.03.5 -moz- 9.03.2 -webkit- 23.015.0 -webkit-10.5 -o- transform-origin(three-value syntax) 36.012.0 -webkit- 10.0 16.010.0 -moz- 9.04.0 -webkit- 23.015.0 -webkit- 属性定义及使用说明transform-Origin属性允许您更改转换元素的位置。2D转换元素可以改变元素的X和Y轴。 3D转换元素，还可以更改元素的Z轴。为了更好地理解Transform-Origin属性，请查看这个演示.注意： 使用此属性必须先使用transform 属性。Tip:Safari/Chrome用户：为了更好地理解3D 转换属性,请查看演示.默认值： 50% 50% 0 继承： no 版本： CSS3 JavaScript 语法： object.style.transformOrigin="20% 40%" 语法transform-origin: x-axis y-axis z-axis;值描述x-axis定义视图被置于 X 轴的何处。可能的值：leftcenterrightlength%y-axis定义视图被置于 Y 轴的何处。可能的值：topcenterbottomlength%z-axis定义视图被置于 Z 轴的何处。可能的值：length