CSS perspective 属性

定義と使用法

perspective属性は、3D要素がビューから離れる距離をピクセルで定義します。この属性は、3D要素の視点を変更することができます。

perspective属性を要素に定義すると、その子要素が透视効果を得ますが、要素自体はありません。

注釈：perspective属性は、3D変換要素にのみ影響します。

ヒント：次に： perspective-origin この属性と一緒に使用すると、3D要素の底の位置を変更できます。

も参照してください：

CSS3チュートリアル：CSS3 3D 转换

HTML DOMリファレンスマニュアル：perspective属性

例

要素が見られる位置のビューを設定します：

div
{
perspective: 500;
}

実際に試してみてください

CSS语法

perspective: number|none;

属性値

値 説明
number 要素がビューポートから離れる距離をピクセルで示します。
なし デフォルト値。0と同じです。透视を設定しません。

技術的詳細

デフォルト値： なし
継承性： はい
バージョン： CSS3
JavaScript语法： object.style.perspective=500

ブラウザのサポート

テーブルの数字は、その属性を完全にサポートする最初のブラウザのバージョンを示しています。

prefixを使用する最初のバージョンの数字を示す-webkit-や-moz-を持つ。

Chrome IE / Edge Firefox Safari Opera
36.0
12.0 -webkit-		 10.0 16.0
10.0 -moz-		 9.0
4.0.3 -webkit-		 23.0
15.0 -webkit-