-webkit-transform-3d

非標準
この機能は標準ではなく、標準化の予定もありません。公開されているウェブサイトには使用しないでください。ユーザーによっては使用できないことがあります。実装ごとに大きな差があることもあり、将来は振る舞いが変わるかもしれません。

CSS-webkit-transform-3d メディア特性Chrome 拡張で、真偽値型であり、ベンダー接頭辞付きの CSS 3D transform に対応していれば値が true になります。

メモ: このメディア特性は WebKit および Blink でのみ対応しています。可能であれば、 @supports 特性クエリを代わりに使用してください。

@media (-webkit-transform-3d) {
  .foo {
    transform-style: preserve-3d;
  }
}

@media (-webkit-transform-3d: 1) {
  .foo {
    transform-style: preserve-3d;
  }
}

仕様書

仕様書 状態 備考
Compatibility Standard
-webkit-transform-3d の定義
現行の標準 初回の標準化
Safari CSS Reference
'media query extensions' in that document.
標準外の非公式文書 初回定義

ブラウザーの対応

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
-webkit-transform-3d media feature
非標準
Chrome 未対応 2 — 36Edge 完全対応 12Firefox 完全対応 49
完全対応 49
完全対応 46
無効
無効 From version 46: this feature is behind the layout.css.prefixes.webkit preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE 未対応 なしOpera 未対応 ? — 23Safari 完全対応 4WebView Android 未対応 ≤37 — ≤37Chrome Android 未対応 18 — 36Firefox Android 完全対応 49
完全対応 49
完全対応 46
無効
無効 From version 46: this feature is behind the layout.css.prefixes.webkit preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android 未対応 ? — 24Safari iOS 完全対応 3.2Samsung Internet Android 未対応 1.0 — 3.0

凡例

完全対応  
完全対応
未対応  
未対応
非標準。ブラウザー間の互換性が低い可能性があります。
非標準。ブラウザー間の互換性が低い可能性があります。
ユーザーが明示的にこの機能を有効にしなければなりません。
ユーザーが明示的にこの機能を有効にしなければなりません。

関連情報