adminCSS3
transition-property属性
实例
将鼠标悬停在一个div元素上，逐步改变表格的宽度：
div
{
width:100px;
height:100px;
background:red;
transition-property: width;
transition-duration: 2s;
-webkit-transition-property: width; /* Safari */
-webkit-transition-duration: 2s; /* Safari */
}
尝试一下 »
在此页底部有更多的例子。
浏览器支持
表格中的数字表示支持该属性的第一个浏览器版本号。
紧跟在 -webkit-, -ms- 或 -moz- 前的数字为支持该前缀属性的第一个浏览器版本号。
属性
transition-property
26.04.0 -webkit-
10.0
16.04.0 -moz-
6.13.1 -webkit-
12.110.5 -o-
属性定义及使用说明
transition-property 是 CSS3 中用来指定过渡效果应用到哪些 CSS 属性上的属性。它允许你明确指定要过渡的属性，从而在元素状态发生改变时仅对指定的属性应用过渡效果，而不是对所有属性都应用过渡效果。
该属性的值可以是 CSS 属性的名称，也可以是关键字 all，表示对所有属性应用过渡效果。
例如，如果你只想在颜色发生变化时应用过渡效果，可以这样写：
.element {
transition-property: color;
}
这样，当 .element 元素的颜色发生改变时，就会产生过渡效果。
如果想对所有属性都应用过渡效果，可以使用 all 关键字：
.element {
transition-property: all;
}
这样，无论哪个属性发生变化，都会产生过渡效果。
你也可以同时指定多个属性，以逗号分隔：
.element {
transition-property: width, height, opacity;
}
这样，当 .element 元素的宽度、高度或透明度发生变化时，都会产生过渡效果。
默认值：
all
继承：
no
版本：
CSS3
JavaScript 语法：
object.style.transitionProperty="width,height"
语法
transition-property: none|all|
property;
值
描述
none
没有属性会获得过渡效果。
all
所有属性都将获得过渡效果。
property
定义应用过渡效果的 CSS 属性名称列表，列表以逗号分隔。
更多实例
转换效果 - 更改两个属性
将鼠标悬停在一个div元素上，更改宽度和高度用平稳过渡效果。