transform-style

これは実験段階の機能です。
この機能は複数のブラウザで開発中の状態にあります。各ブラウザで用いるために、適切なベンダー接頭辞が必要な場合があります。互換性テーブルをチェックしてください。また、実験段階の機能の構文と挙動は、仕様変更に伴い各ブラウザの将来のバージョンで変更になる可能性があることに注意してください。

概要

CSStransform-style プロパティは、要素の子要素が 3D 空間に配置されるのか、平らにされて要素の面上に配置されるのかを決めます。

平らにされるなら、子要素自身は 3D 空間に存在しなくなります。

このプロパティは継承されないため、葉要素でないすべての子孫要素でセットする必要があります。

初期値flat
適用対象変形可能要素
継承不可
メディアvisual
計算値指定値
アニメーションの可否不可
正規順序形式文法で定義される一意のあいまいでない順序
Creates stacking context継承する

構文

形式文法: flat | preserve-3d
transform-style: preserve-3d
transform-style: flat

transform-style: inherit

preserve-3d
要素の子要素を 3D 空間に配置することを示すキーワードです。
flat
要素の子要素を要素自身の面上に置くことを示すキーワードです。

---

仕様

仕様書 策定状況 コメント
CSS Transforms Level 1
The definition of 'transform-style' in that specification.
草案  

ブラウザ実装状況

機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
基本サポート 12-webkit 10 (10)-moz
16 (16)
未サポート # 未サポート (有)-webkit
機能 Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
基本サポート 3.0-webkit 10.0 (10)-moz
16.0 (16)
? 未サポート (有)-webkit

関連情報

ドキュメントのタグと貢献者

 このページの貢献者: fscholz, Sebastianz, ethertank, sosleepy
 最終更新者: fscholz,