Від автора: У цій статті я покажу вам різні методи визначення підтримки браузером властивостей CSS за допомогою CSS і JavaScript’а.
Визначення за допомогою CSS3
У CSS3 для перевірки підтримки якого-небудь властивості CSS передбачено умовне правило @supports. Давайте розглянемо приклад його використання
Визначення за допомогою JavaScript’а
З допомогою JavaScript’а підтримка властивості CSS визначається двома методами. Класичним:
При якому розробник користується оператором in для визначення того, підтримується дана властивість CSS чи ні.
І CSS.supports.
CSS.supports – це функція, підпорядкована специфікації правила CSS3 @support. Будь-браузер, що підтримує правило @support, буде підтримувати цю функцію.
Крім того, для функції CSS.supports існує полифил. Офіційна документація правила CSS3 @support.
Визначення підтримки правила @supports з допомогою JavaScript’а
Раніше вже згадувалося, що будь-який браузер, що підтримує CSS @supports, також підтримує функцію CSS.supports. Отже, просто перевірте, підтримується CSS.supports чи ні.
Якщо ви переписали функцію з допомогою вищезгаданого полифила, то потім можна перевірити, чи містить функція вихідний код. Якщо містить, то підтримується, або навпаки. Прочитайте цю статтю і дізнаєтесь, як виявити, чи має функція вихідний код.