👩💻 CSS support
Не многие знают, что в JavaScript есть встроенный метод, позволяющий проверить, поддерживает ли браузер определённое CSS-свойство или его значение. Этот метод - CSS.supports().
Рассмотрим примеры: `console.log(CSS.supports("display", "grid")); // true (если браузер поддерживает grid)
console.log(CSS.supports("color", "blue")); // true (почти всегда)
console.log(CSS.supports("position", "sticky"));
// true (если браузер поддерживает position: sticky)
Можно также проверять несколько условий с or и and: `console.log(CSS.supports("(display: grid) and (color: red)")); // true, если обе поддержки есть
console.log(CSS.supports("(display: flex) or (display: grid)")); // true, если хотя бы одно поддерживается
Еще важно заметить, что свойство можно использовать внутри CSS, с помощью @supports: `@supports (display: grid) { .container { display: grid; } }
❕Есть ограничения: ⚫️ Не проверяет поддержку нестандартных префиксированных свойств (например, -webkit-). ⚫️ Работает только с известными CSS-свойствами, если свойство неизвестно браузеру - всегда false.
🔗 Ссылка на доку```