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

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