只让css过渡作用于某一个属性需明确设置transition-Property，如仅color过渡；避免用all或省略导致意外动画；可逗号分隔多个属性，设none禁用过渡；配合timing-function和delay可精准控制效果。
只让 CSS 过渡作用于某一个属性，关键就是明确设置 transition-property，而不是用 all 或留空（默认值是 all）。
只过渡 color 属性
比如只想让文字颜色平滑变化，其他属性（如 background、font-size）不参与过渡：
button { color: blue; background: #eee; transition-property: color; transition-duration: 0.3s; } button:hover { color: red; }
这样 hover 时只有 color 变化带动画，background 立即切换，毫无过渡。
避免误用 all 或省略 property
transition: 0.3s; 等价于 transition-property: all;，会把所有可动画属性都加上过渡，容易引发意外效果（比如 layout 变化卡顿、多余闪烁）。明确写出要过渡的属性更安全、更可控。
立即学习“前端免费学习笔记（深入）”；
- 想过渡多个特定属性？用逗号分隔：
transition-property: color, transform, opacity; - 完全不想过渡某个属性？确保它不在
transition-property列表里 - 想临时禁用过渡？可设为
none：transition-property: none;
配合 transition-timing-function 和 delay 更精准控制
单独指定 property 后，还能为它搭配专属的缓动和延迟（需用完整 transition 写法或分开声明）：
a { color: #333; transition-property: color; transition-duration: 0.4s; transition-timing-function: ease-in-out; transition-delay: 0.1s; } a:hover { color: #007bff; }
这样 color 过渡就有节奏感，且延迟触发，体验更细腻。