概述`@supports` 允许在满足条件时应用样式规则,用于新特性启用与回退。配合 `not` 与复合条件编写可维护的兼容策略。用法/示例@supports (container-type: inline-size) { .card { container-type: inline-size } } @supports not (height: 100dvh) { .screen { min-height: 100vh } } 工程建议将特性查询集中到组件或入口样式,避免分散造成维护困难。为关键路径提供明确的回退规则并验证多设备表现。定期更新兼容矩阵与策略,移除过时的回退以减少体积。参考与验证MDN:`@supports` — https://developer.mozilla.org/docs/Web/CSS/@supportsW3C:CSS Conditional Rules — https://www.w3.org/TR/css-conditional-3/

发表评论 取消回复