非推奨
この機能はウェブ標準から削除されました。まだ対応しているプラウザーがあるかもしれませんが、ゆくゆくはなくなるものです。使用を避け、できれば既存のコードを更新してください。このページの下部にあるブラウザーの対応を見て判断してください。この機能は突然動作しなくなる可能性があることに注意してください。
非標準
この機能は標準ではなく、標準化の予定もありません。公開されているウェブサイトには使用しないでください。ユーザーによっては使用できないことがあります。実装ごとに大きな差があることもあり、将来は振る舞いが変わるかもしれません。
CSS の -webkit-transition メディア特性 は Chrome 拡張で、真偽値型であり、閲覧コンテキストが CSS トランジションに対応していれば値が true になります。 WebKit または Blink 以外を使用したブラウザーでは対応していません。
メモ: このメディア特性は使用しないでください。これは仕様化されておらず、広く実装されておらず、すべてのブラウザーから削除されています。代わりに @supports 特性クエリを使用してください。
例
代わりに @supports を使用してください
-webkit-transition メディア特性を使用しないでください。代わりに、 CSS の @supports @-規則を用いてトランジションの有無を判定してください。
@supports (transition: initial) {
/* トランジションに対応している場合に使われる CSS */
}
廃止された例
廃止される以前、次のように -webkit-transition を使用することができました。
@media (-webkit-transition) {
/* トランジションに対応している場合に使われる CSS */
}
仕様書
仕様書では定義されていません。 Apple には Safari CSS Reference に説明があります。
ブラウザーの対応
このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 https://github.com/mdn/browser-compat-data をチェックアウトしてプルリクエストを送信してください。
| デスクトップ | モバイル | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
-webkit-transition media feature | Chrome 未対応 2 — 36 | Edge 未対応 なし | Firefox 未対応 なし | IE 未対応 なし | Opera 未対応 ? — 23 | Safari 完全対応 4 | WebView Android 未対応 ? — 37 | Chrome Android 未対応 18 — 36 | Firefox Android 未対応 なし | Opera Android 未対応 ? — 24 | Safari iOS 完全対応 3.2 | Samsung Internet Android 未対応 1.0 — 3.0 |
凡例
- 完全対応
- 完全対応
- 未対応
- 未対応
- 非標準。ブラウザー間の互換性が低い可能性があります。
- 非標準。ブラウザー間の互換性が低い可能性があります。
- 非推奨。新しいウェブサイトでは使用しないでください。
- 非推奨。新しいウェブサイトでは使用しないでください。