transition-duration生效需满足：触发可过渡属性的计算值变化，正确设置单位（s/ms），配合transition-property或简写，且初终态值不同；多属性可分别设时长，媒体查询和伪类中动态修改有效。
transition-duration 设置后没生效？先确认是否触发了样式变化
CSS transition-duration 只在元素的可过渡属性（如 color、opacity、transform、width 等）发生**计算值变化**时才起作用。单纯写上 transition-duration: 2s 并不会让元素“自动动起来”。
常见误操作：
- 只写了
transition-duration，但没配transition-property或transition简写 - 目标样式被 JavaScript 强制重写（比如直接改
style.left），绕过了 CSS 计算流程 - 初始状态和终态的值完全相同（例如都设为
opacity: 1），浏览器不触发重排重绘
transition-duration 的单位和取值范围怎么用才稳
transition-duration 接受时间值，单位只能是 s（秒）或 ms（毫秒），不支持百分比、em 或无单位数字。
合法写法示例：
立即学习“前端免费学习笔记（深入）”；
transition-duration: 0.3s; transition-duration: 300ms; transition-duration: 0s; /* 允许，表示禁用过渡（但保留 transition 其他配置）*/
非法写法（会整个声明失效）：
-
transition-duration: 300;（缺单位） -
transition-duration: 0.3;（同上） -
transition-duration: 300px;（单位错误）
多个属性过渡时，duration 是统一控制还是分别设置
如果用简写 transition，transition-duration 默认作用于所有指定的 transition-property；但也可以为不同属性单独配时长，用逗号分隔：
