Запросы функций CSS

Как работать с запросами функций в CSS

Функциональные запросы - это недавняя и относительно неизвестная способность CSS, нохорошо поддерживаетсяодин.

Мы можем использовать его, чтобы проверить, поддерживается ли функция браузером, используя@supportsключевое слово.

Это пример, который, на мой взгляд, особенно полезен на момент написания статьи для проверки, поддерживает ли браузер сетку CSS, что можно сделать с помощью:

@supports (display: grid) {
  /* apply this CSS */
}

Проверяем, поддерживает ли браузерgridценность дляdisplayсвойство.

Мы можем использовать@supportsдля любого свойства CSS, чтобы проверить любое значение.

Мы также можем использовать логические операторыand,orиnotдля построения сложных запросов функций.

В этом примере проверяется, поддерживает ли браузер обаCSS-сеткаиFlexbox:

@supports (display: grid) and (display: flex) {
  /* apply this CSS */
}

Скачать мою бесплатнуюСправочник CSS


Больше руководств по css: