此页面由社区从英文翻译而来。了解更多并加入 MDN Web Docs 社区。
transition-property
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年9月.
transition-property 指定应用过渡属性的名称。
尝试一下
transition-property: margin-right;transition-property: margin-right, color;transition-property: all;transition-property: none;<section> <div>Hover to see<br />the transition.</div></section>#example-element { background-color: #e4f0f5; color: #000; padding: 1rem; border-radius: 0.5rem; font: 1em monospace; width: 100%; transition: margin-right 2s;}#default-example:hover > #example-element { background-color: #909; color: #fff; margin-right: 40%;}如果指定简写属性（比如background），那么其完整版中所有可以动画的属性都会被应用过渡。
语法
css
/* Keyword values */transition-property: none;transition-property: all;transition-property: test_05;transition-property: -specific;transition-property: sliding-vertically;transition-property: test1;transition-property: test1, animation4;transition-property: all, height, all;transition-property: all, -moz-specific, sliding;/* Global values */transition-property: inherit;transition-property: initial;transition-property: unset;取值
形式定义
形式语法
transition-property =
none|
<single-transition-property>#
<single-transition-property> =
all|
<custom-ident>
示例
在CSS 过渡中有几个示例可以参考。
规范
| Specification |
|---|
| CSS Transitions # transition-property-property |