Style perspectiveOrigin 屬性

Style 對象參考手冊 Style 對象

實例

設置 3D 元素的基點位置：

document.getElementById("myDIV").style.perspectiveOrigin="10px 50%";

定義和用法

perspectiveOrigin 屬性定義 3D 元素基於 X 軸和 Y 軸的位置。該屬性允許您改變 3D 元素的底部位置。

當為元素定義 perspectiveOrigin 屬性時，其子元素會獲得透視效果，而不是元素本身。

注意：請把該屬性與 perspective 屬性一起使用，而且只影響 3D 轉換元素！

流覽器支持

Internet Explorer Firefox Opera Google Chrome Safari

IE10+ 和 Firefox 支持 perspectiveOrigin 屬性。

Chrome、Safari 和 Opera 支持另一個可替代該屬性的屬性，即 WebkitPerspecitveOrigin 屬性。

語法

返回 perspectiveOrigin 屬性：

object.style.perspectiveOrigin

設置 perspectiveOrigin 屬性：

object.style.perspectiveOrigin="x-axis y-axis|initial|inherit"

屬性值

值 描述
x-axis 定義該視圖在 x 軸上的位置。

可能的值：

  • left
  • center
  • right
  • length
  • %

默認值：50%
y-axis 定義該視圖在 y 軸上的位置。

可能的值：

  • top
  • center
  • bottom
  • length
  • %

默認值：50%
initial 設置該屬性為它的默認值。請參閱 initial。
inherit 從父元素繼承該屬性。請參閱 inherit。

技術細節

默認值： 50% 50%
返回值： 字串，表示元素的 perspective-origin 屬性。
CSS 版本 CSS3

相關文章

JavaScript Style 對象：perspective 屬性

CSS 參考手冊：perspective-origin 屬性

Style 對象參考手冊 Style 對象