"CSS @supports 特性查询：渐进增强与回退策略"

概述`@supports` 允许基于浏览器对某 CSS 特性的支持与否来启用或回退样式，是渐进增强与兼容策略的重要工具。结合 `@layer` 与低特异性规则可提升可维护性。语法与示例@supports (container-type: inline-size) { .card { container-type: inline-size; } } @supports not (container-type: inline-size) { .card { display: grid; } } 工程建议仅围绕需要的特性写最小查询块；避免过多嵌套导致复杂级联。与 `@layer`/`:where()` 协作管理级联与特异性，减少覆盖冲突。参考与验证［参考1］MDN 中文：`@supports` 特性查询语法与示例：https://developer.mozilla.org/zh-CN/docs/Web/CSS/@supports［参考2］web.dev：渐进增强与特性检测策略与案例：https://web.dev/articles/progressive-web-apps关键词校验关键词与 `@supports` 渐进增强一致。