Style perspectiveOrigin 屬性

定義和用法

perspectiveOrigin 屬性定義 3D 元素在 x 軸和 y 軸上的位置。此屬性允許您更改 3D 元素的底部位置。

在定義元素的 perspectiveOrigin 屬性時，定位的是子元素，而不是元素本身。

注釋：此屬性必須與 perspective 屬性 一起使用，并且僅影響 3D 轉換的元素！

另請參閱：

JavaScript Style 對象：perspective 屬性

CSS 參考手冊：perspective-origin 屬性

實例

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

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

親自試一試

語法

返回 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

瀏覽器支持

表中的數字注明了首個完全支持該屬性的瀏覽器版本。

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
36.0 10.0 16.0 6.1 23.0