CSS3perspective-origin屬性

實例

設置一個3D元素的基數位置：

div
{
perspective:150;
perspective-origin: 10% 10%;
-webkit-perspective:150; /* Safari and Chrome */
-webkit-perspective-origin: 10% 10%; /* Safari and Chrome */
}

瀏覽器支持

表格中的數字表示支持該屬性的第一個瀏覽器版本號。

緊跟在 -webkit-, -ms- 或 -moz- 前的數字為支持該前綴屬性的第一個瀏覽器版本號。

屬性     
perspective-origin36.0
12.0 -webkit-		10.016.0
10.0 -moz-		9.0
4.0.3 -webkit-		23.0
15.0 -webkit-

屬性定義及使用說明

perspective-origin 屬性定義 3D 元素所基于的 X 軸和 Y 軸。該屬性允許您改變 3D 元素的底部位置。

定義時的perspective -Origin屬性，它是一個元素的子元素，透視圖，而不是元素本身。

注意：對于Chrome和Safari用戶：為了更好地理解perspective屬性!

對于 Chrome 和 Safari 用戶:為了更好地理解perspective-Origin屬性，請查看查看實例.

默認值：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
  • %