Кратко

  • Первый публичный рабочий проект W3C о CSS Conditional Rules, датированный 1 сентября 2011 года, ввёл @supports для применения группы правил в зависимости от поддержки свойства и значения. Проект 2012 года уточнил устройство условия.
  • Кандидатская рекомендация от 4 апреля 2013 года описала not, and и or. Кандидатский текст от 13 января 2022 года связал положительный ответ с принятием декларации, реализованной на пригодном для работы уровне.

Браузер давно умел проявлять такт. Встретив незнакомую CSS-декларацию, он мог пропустить её и продолжить. Для отдельной рамки это часто достаточно. Новый способ раскладывать материал на странице требует нескольких взаимосвязанных указаний. Если приехали колонки, но забыли порядок чтения, получится переезд редакции, при котором столы доставили, а двери оставили в старом здании.

Первый публичный рабочий проект W3C от 1 сентября 2011 года предложил собеседование. @supports ставил группу правил за вопросом о свойстве и значении. Положительный ответ открывал путь новому макету, противоположный — запасному. В раннем проекте обсуждался также @document, но история проверки возможностей в кандидатском документе 2013 года сосредоточилась вокруг @supports.

Вопрос можно сформулировать как @supports (display: flex). Это проверка конкретной декларации, а не репутации браузера. Рабочий проект от 11 сентября 2012 года развивал грамматику: not обращает ответ, and требует нескольких навыков одновременно, or допускает разные подходящие варианты. Автор спрашивает о нужной работе, а не пытается угадать способности программы по названию или возрасту её значка.

В кандидатской рекомендации от 4 апреля 2013 года есть показательный пример. Правила гибкой раскладки заключены в положительную ветвь, а ширины для другого варианта — в ветвь с not. Документ замечает, что эти ширины могут помешать гибкой раскладке, если попадут и туда. Условие управляет целым набором согласованных решений. Оно не просто выдаёт браузеру значок отличника.

Что означает «поддерживаю» по правилам этого собеседования? Документ 2013 года связывает поддержку с принятием декларации вместо её отбрасывания из-за ошибки разбора и требует пригодной реализации значения. Кандидатский снимок от 13 января 2022 года прямо формулирует проверку для декларации внутри правила стиля. Ответ касается способности обработать свойство и значение. О том, хорош ли отступ у заголовка, кандидата здесь не спрашивали.

Спецификация приводит пример для трезвого взгляда на результат. Предпочтение высокого контраста может изменить видимый цвет, хотя браузер по-прежнему поддерживает свойство color. На итог влияют также каскад и соседние правила. Кандидат честно отвечает на технический вопрос; редакция всё равно обязана открыть страницу и оценить её. Умение пользоваться инструментом и качество собранной полосы различаются.

Запасной вариант поэтому нужен как полноценная вёрстка. У блока @supports not (...) должны быть подходящие ширины, понятная навигация и осмысленный порядок чтения. Положительную ветвь тоже стоит проверить на настоящих заголовках, таблицах и изображениях. Система выбирает комплект правил по ответу, но не исправляет тесную колонку и не пишет редактору удачный подзаголовок.

На занятии W3C, которое Берт Бос провёл на WWW2013, правило можно было увидеть в действии. Демонстрационная страница сначала прятала шесть сообщений, затем открывала подходящие по положительным, отрицательным и соединённым через or условиям @supports. Один из вопросов касался display: flex. Это была настоящая страница для проверки ответа браузера, а не просто строка в документе. Превратить такой выбор в удобную газетную полосу — уже работа автора.

Четыре документа отмечают путь нормы: первый публичный проект 2011 года, рабочий проект 2012-го, кандидатская рекомендация 2013-го и кандидатский снимок 2022-го. Этот путь объясняет, какие вопросы CSS может задавать и что означает ответ браузера. Дальше начинается работа автора: две удобные версии страницы, каждая для своих условий. Собеседование прошло быстро. Обустраивать место для читателя пришлось дольше.