實例
設置 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 屬性一同使用,而且只影響 3D 轉換元素。
默認值: | 50% 50% |
---|---|
繼承性: | no |
版本: | CSS3 |
JavaScript 語法: | object.style.perspectiveOrigin="10% 10%" |
語法
perspective-origin: x-axis y-axis;
值 | 描述 |
---|---|
x-axis |
定義該視圖在 x 軸上的位置。默認值:50%。 可能的值:
|
y-axis |
定義該視圖在 y 軸上的位置。默認值:50%。 可能的值:
|
更多建議: