React MUI过渡属性有哪些？如何查找transform外的其他可选属性？
2026-7-12
React MUI Transition 支持的属性及获取途径
theme.transitions.create() 支持的属性并非只有transform，它本质上兼容所有CSS标准中支持过渡动画的属性——因为MUI的过渡系统底层就是基于原生CSS transition属性实现的，只要是CSS允许添加过渡的属性，都可以作为参数传入。
常见可用属性示例
- 颜色相关：
color、background-color、border-color、fill（SVG元素） - 尺寸与布局：
width、height、margin、padding、top、left、max-width - 视觉效果：
opacity、box-shadow、border-radius、filter - 变形类：
transform、scale、rotate（推荐用transform统一定义复杂变形） - 文本相关：
font-size、line-height、letter-spacing
获取完整可选属性的途径
- 参考CSS官方标准：所有CSS
transition支持的属性都适用，只要属性的取值是可插值的（比如数值、颜色、渐变等），都能实现过渡效果。 - 查看MUI源码逻辑：
theme.transitions.create方法的核心逻辑是将传入的属性名拼接成合法的CSStransition声明，没有额外的属性限制——它只是对属性名做简单格式处理，并没有过滤或限定属性范围。
你的示例代码中已经用到了color和transform，这两个都是完全合法的用法，更多属性可以根据动画需求，直接从CSS可过渡属性中挑选使用。
内容的提问来源于stack exchange，提问作者dellus
相关产品推荐
相关产品推荐
