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

## 概述 `@property` 允许为 CSS 自定义属性声明类型、继承与初始值，使其可参与动画与插值。适用于色彩、长度与角度等场景，提升动效与主题化能力。 ## 用法/示例 ```css @property --angle { syntax: ''; inherits: false; initial-value: 0deg; } .box { transition: --angle 300ms ease; transform: rotate(var(--angle)); } .box:hover { --angle: 20deg } ``` ## 工程建议 - 为属性选择合适的 `syntax`，确保插值与过渡符合预期。 - 与 Typed OM 配合在 JS 中安全读写值；不支持环境下使用传统变量或直接属性过渡。 - 控制属性数量与作用域，避免全局污染与解析开销。 ## 参考与验证 - MDN：`@property` — https://developer.mozilla.org/docs/Web/CSS/@property - web.dev：Houdini — https://web.dev/articles/houdini