-webkit-transition

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

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

メモ: すべてのブラウザーが、ベンダー接頭辞なしの transition プロパティに対応しています。Chromium ベースのブラウザーではなく、 WebKit (Safari) だけが -webkit-transition メディア特性に対応しています。メディアクエリーとして接頭辞なしの transition に対応しているブラウザーはありません(ただし、一部のブラウザーは -webkit-transform-3d には対応しています)。代わりに、 @supports (transition) 機能クエリーを使用してください。

-webkit-transitionCSS の標準外の論理メディア特性で、 WebKit 拡張であり、閲覧コンテキストが CSS トランジションに対応していれば値が true になります。

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 */
}

仕様書

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

ブラウザーの互換性

関連情報