"CSS 自定义属性注册：@property 与过渡控制"

概述`@property` 允许为 CSS 自定义属性声明类型与默认值，使其可参与过渡与动画。适用于驱动主题与动效参数（如角度、长度、颜色）。示例@property --angle { syntax: '<angle>'; inherits: false; initial-value: 0deg } .spinner { --angle: 0deg; transform: rotate(var(--angle)); transition: --angle 300ms ease } .spinner:hover { --angle: 45deg } 工程建议类型匹配：为需要过渡的属性选择正确 `syntax`（如 `<angle>`/`<length>`/`<color>`）。继承与默认值：根据作用域设置 `inherits` 与 `initial-value`；避免未定义导致布局异常。兼容：不支持的浏览器回退到直接动画目标属性或 JS 动画；进行特性检测。参考与验证MDN `@property` 文档：https://developer.mozilla.org/docs/Web/CSS/@propertyweb.dev 指南：https://web.dev/articles/at-propertyChrome 平台文档：https://developer.chrome.com/docs/web-platform/property-and-values-api/