В одном из предыдущих постов мы обсуждали достаточно специфичные значения свойства
text-wrap, который на данный момент поддерживаются не всеми браузерами. Но как убедиться в момент, что текущий браузер поддерживает ту или иную опцию?@supports — это правило CSS, которое позволяет проверять, поддерживает ли браузер определённое свойство или его значение. Если свойство поддерживается, то стили, вложенные в @supports, применяются.Например, мы бы могли переписать пример из предыдущего поста так, чтобы применять значения, только если они поддерживаются данным браузером, а в противном случае, если свойство не поддерживается, акцентировать это цветом.
Таким образом, с помощью директивы
@support вы можете не только проверять доступность свойств прямо в CSS, но и использовать фоллбеки при необходимости.