是，transition-duration 支持小数秒（如 0.35s），浏览器按浮点精度解析并渲染；小数用于精准对齐动画库时间轴、微调悬停反馈、错开多层过渡及适配设计规范，但需规避小于 0.001s 失效、CSSOM 四舍五入及低性能下帧率掩盖等陷阱。
css transition-duration 支持小数秒吗
支持，transition-duration 的值可以是任意合法的 <time></time> 类型，包括带小数的秒（如 0.35s）或毫秒（如 350ms）。浏览器解析时会按浮点精度处理，实际渲染也完全接受小数值。
小数 duration 在哪些场景下真正有用
小数控制不是为了“炫技”，而是解决真实节奏问题：
- 需要与动画库（如 Framer Motion、GSAP）的时间轴对齐时，常出现
0.23s这类非整百毫秒值 - 微调悬停反馈：比如
0.12s比0.1s更顺滑，比0.15s更灵敏，人眼能感知差异 - 多层过渡叠加时，错开
0.03s可避免视觉粘连（例如背景色变 + transform 位移分时触发） - 适配系统动效规范（如 Material Design 推荐的
0.28s、0.32s）
容易被忽略的兼容性与精度陷阱
小数本身无兼容问题，但以下几点直接影响效果是否如预期：
- 小于
0.001s（即1ms）的值会被浏览器四舍五入为0s，等同于无过渡 —— 例如0.0007s实际无效 - CSSOM 读取时（如
getComputedStyle(el).transitionDuration），部分浏览器可能返回四舍五入后的字符串（"0.3s"而非原始"0.29s"），但不影响渲染 - 在低性能设备或页面重绘压力大时，
0.04s和0.06s的差异可能被帧率掩盖（60fps 下每帧约0.0167s），此时更应关注是否达到目标帧数区间 - 不要用小数“假装”精确控制——过渡的实际起止仍受 CSS 触发时机、主线程阻塞影响，
0.234s和0.235s在绝大多数场景下无感知差别
推荐的小数写法与实操建议
统一用秒单位写小数，更易读且避免 ms 下的大数字：
立即学习“前端免费学习笔记（深入）”；
button {
transition-duration: 0.28s; /* ✅ 清晰，符合设计系统 */
}
button:hover {
transform: scale(1.02);
}- 优先使用两位小数（
0.28s），三位仅在严格对齐动效规范时采用（如0.285s） - 避免
0.0s或0s混用：显式写0s表示禁用过渡，0.001s才是“最短有效过渡” - 调试时可临时加
transition-timing-function: linear，排除缓动干扰后专注验证时长是否生效
小数 duration 确实可用，但它的价值不在“能写多细”，而在于能否匹配设计意图和用户感知阈值；写 0.337s 不如想清楚为什么不是 0.3s 或 0.35s。
