perspective-origin

語法:

perspective-origin:[ <percentage> | <length> | left | center1 | right ] [ <percentage> | <length> | top | center2 | bottom ]?

預設值50% 50%,效果等同於center center

適用於:變換元素

繼承性:無

動畫性:當值為數值時

計算值:除了指定絕對值,否則都為百分比

媒體:視覺

取值:

<percentage>
用百分比指定透視點坐標值,相對於元素寬度。可以為負值。
<length>
用長度值指定透視點坐標值。可以為負值。
left:
指定透視點的橫坐標為left
center1:
指定透視點的橫坐標為center
right:
指定透視點的橫坐標為right
top:
指定透視點的縱坐標為top
center2:
指定透視點的縱坐標為center
bottom:
指定透視點的縱坐標為bottom

說明:

指定透視點的位置。
  • 該屬性提供2個參數值。
  • 如果提供兩個,第一個用於橫坐標,第二個用於縱坐標。
  • 如果只提供一個,該值將用於橫坐標;縱坐標將預設為center。
  • 對應的腳本特性為perspactiveOrigin

兼容性:

  • 淺綠 = 支援
  • 紅色 = 不支援
  • 粉色 = 部分支援
Values IE Firefox Chrome Safari Opera iOS Safari Android Browser Android Chrome
Basic Support 6.0-9.0 2.0-9.0 4.0-11.0 6.0-8.0-webkit- 15.0-22.0-webkit- 6.0-8.4-webkit- 2.1-2.3 18.0-34.0-webkit-
10.0-11.0-ms- 10.0-15.0-moz- 12.0-35.0-webkit- 9.0+ 23.0+ 9.0+ 3.0-4.4.4-webkit- 35.0+
Edge 16.0+ 36.0+ 40.0+

示例: