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