-webkit-transition

非推奨;: この機能は非推奨になりました。まだ対応しているブラウザーがあるかもしれませんが、すでに関連するウェブ標準から削除されているか、削除の手続き中であるか、互換性のためだけに残されている可能性があります。使用を避け、できれば既存のコードは更新してください。このページの下部にある互換性一覧表を見て判断してください。この機能は突然動作しなくなる可能性があることに注意してください。

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

-webkit-transitionCSS の論理メディア特性で、 Chrome 拡張であり、閲覧コンテキストが CSS トランジションに対応していれば値が true になります。 WebKit または Blink 以外を使用したブラウザーでは対応していません。

Apple には Safari CSS リファレンスに説明があります。ここでは transition と呼ばれるようになりました。

メモ: このメディア特性は使用しないでください。これは仕様化されておらず、広く実装されておらず、すべてのブラウザーから削除されています。代わりに @supports 特性クエリーを使用してください。

構文

css
@media (-webkit-transition) {
  /* トランジションに対応している場合に使用される CSS */
}

代わりに @supports を使用してください

-webkit-transition メディア特性を使用しないでください。代わりに、次のように CSS の @supports アットルールを用いてトランジションの対応を検査してください。

css
@supports (transition: initial) {
  /* トランジションに対応している場合に使われる CSS */
}

廃止された例

廃止される以前、次のように -webkit-transition を使用することができました。

css
@media (-webkit-transition) {
  /* トランジションに対応している場合に使われる CSS */
}

仕様書

どの標準でも定義されていません。

ブラウザーの互換性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
-webkit-transition media feature
DeprecatedNon-standard

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
No support
No support
Non-standard. Check cross-browser support before using.
Deprecated. Not for use in new websites.

関連情報