# CSS3 perspective-origin 属性 ## 实例 设置 3D 元素的基点位置： ``` div { perspective:150; perspective-origin: 10% 10%; -webkit-perspective:150; /* Safari 和 Chrome */ -webkit-perspective-origin: 10% 10%; /* Safari 和 Chrome */ } ``` ## 浏览器支持 目前浏览器都不支持 perspective-origin 属性。 Chrome 和 Safari 支持替代的 -webkit-perspecitve-origin 属性。 ## 定义和用法 perspective-origin 属性定义 3D 元素所基于的 X 轴和 Y 轴。该属性允许您改变 3D 元素的底部位置。 当为元素定义 perspective-origin 属性时，其子元素会获得透视效果，而不是元素本身。 注释：该属性必须与 [perspective](/cssref/pr_perspective.asp "CSS3 perspective 属性") 属性一同使用，而且只影响 3D 转换元素。 | 默认值： | 50% 50% | | --- | --- | | 继承性： | no | | --- | --- | | 版本： | CSS3 | | --- | --- | | JavaScript 语法： | _object_.style.perspectiveOrigin="10% 10%" | | --- | --- | ## 语法 ``` perspective-origin: _x-axis_ _y-axis_; ``` | 值 | 描述 | | --- | --- | | _x-axis_ | 定义该视图在 x 轴上的位置。默认值：50%。 可能的值： * left * center * right * _length_ * _%_ | | _y-axis_ | 定义该视图在 y 轴上的位置。默认值：50%。 可能的值： * top * center * bottom * _length_ * _%_ |