Медиафункция CSS `-webkit-transition`

Устарело: Эта функция больше не рекомендуется. Хотя некоторые браузеры могут по-прежнему её поддерживать, она уже могла быть удалена из соответствующих веб-стандартов, может находиться в процессе удаления или сохраняться только в целях совместимости. Избегайте её использования и по возможности обновите существующий код; чтобы принять решение, ознакомьтесь с таблицей совместимости внизу этой страницы. Учтите, что эта функция может перестать работать в любой момент.

Нестандартное: Эта функция не является стандартной и не входит в процесс стандартизации. Не используйте её на веб-сайтах в рабочей среде: она будет работать не у всех пользователей. Кроме того, между реализациями могут быть существенные различия, а поведение может измениться в будущем.

Примечание: Все браузеры поддерживают свойство transition без вендорных префиксов. Только браузеры на основе WebKit (Safari), но не Chromium, поддерживают медиафункцию -webkit-transition. Ни один браузер не поддерживает transition без префикса в качестве медиазапроса (хотя некоторые браузеры поддерживают -webkit-transform-3d). Вместо этого используйте проверку функции @supports (transition).

Логическая нестандартная медиафункция CSS CSS медиафункция -webkit-transition является расширением WebKit и принимает значение true, если среда просмотра поддерживает переходы CSS.

В справочнике Safari CSS Reference Apple приводит описание этой функции; теперь она называется там transition.

Примечание: Не следует использовать эту медиафункцию: она никогда не была описана в спецификациях, не получила широкого распространения и была удалена из большинства браузеров. Вместо этого используйте проверку функции @supports.

Синтаксис

@media (-webkit-transition) {
  /* CSS to use if this media feature and prefixed transitions are supported */
}

Примеры

Вместо этого используйте @supports

Не используйте медиафункцию -webkit-transition. Вместо этого проверяйте поддержку переходов с помощью CSS @supports at-правила, например:

@supports (transition: initial) {
  /* CSS to use if transitions are supported */
}

Устаревший пример

До того как эта функция устарела, в CSS можно было использовать -webkit-transition следующим образом:

@media (-webkit-transition) {
  /* CSS to use if transitions are supported */
}

Спецификации

Не входит ни в один стандарт.

Совместимость с браузерами

	Компьютеры					Мобильные устройства
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox для Android	Opera Android	Safari на iOS	Samsung Internet	WebView Android	WebView на iOS
`-webkit-transition`	2–36	Нет	Нет	15–23	4	18–36	Нет	14–24	3.2	1.0–3.0	2–37	3.2

См. также

© 2005–2025 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/At-rules/@media/-webkit-transition