实例讲解：
<style type="text/css">
div
{
100px;
height:100px;
background:blue;
transition-property: width;
transition-duration: 2s;
-moz-transition-property: width; /* Firefox 4 */
-moz-transition-duration: 2s; /* Firefox 4 */
-webkit-transition-property: width; /* Safari and Chrome */
-webkit-transition-duration: 2s; /* Safari and Chrome */
-o-transition-property: width; /* Opera */
-o-transition-duration: 2s; /* Opera */
}
div:hover
{
300px;
}
</style>
<body>
<div></div>
</body>
讲解：
把鼠标指针放到div元素上，会产生带有平滑改变元素高度的过滤效果.
注意：IE9以及更早版本的浏览器不支持transition-property属性。
定义和用法：
transition-property属性规定应用过滤效果的Css属性的名称。(当指定的css属性改变时，过滤效果将开始)。
提示：过滤效果通常在用户将鼠标指针浮动到元素上时发生。
注释：请始终设置transition-duration属性，否则时长为0，就不会产生过滤效果。
默认值：all
继承性：no
版本：CSS3
JavaScript语法：object.style.transitionProperty="width,height"
语法：
transition-property：none|all|property
none：没有属性会获取过滤效果
all：所有属性都将获得过滤效果
property：定义应用过滤效果的CSS属性名称列表，列表以逗号分隔。
http://www.w3school.com.cn/cssref/pr_transition-property.asp