CSS3 新增了背景或元素运动过度效果属性 transition，其中有一个取值为过渡实体 transition-property，也就是设置什么参与过渡，有多个实体可供选择，如常用背景颜色(background-color)、背景图象(background-image)、字体颜色(color)等。
为便于选择不同的属性作为过渡实体，以下将在文章最后列出所有可以参与过渡的属性。下面先看 transition-property 的语法规则，再看在网页设计中具体使用实例。
一、transition-property语法规则
transition-property：[, * ]
= none | all |
二、语法说明
1、transition-property 可以设置多组值，默认值为 all
A、 表示第一组参与过渡的属性，不能省略；
B、[]中的 表示第二组参与过渡的属性，可以省略；
C、* 表示第三组、第四组、……第n组参与过渡的属性，可以省略；
2、 取值分别如下：
A、none：表示不设置参与过渡的属性；
B、all：表示所有可以参与过渡的css属性，具体见文章后面；
C、：指定参与过渡的css属性 ；
三、transition-property 多组过渡效果实例
html代码：
- 过度属性为：背景颜色transition-property:background-color;
- 过度属性为：边框颜色和宽度transition-property:border-color,border-width;
- 过度属性为：字体颜色transition-property:color;
- 过度属性为：字体大小transition-property:font-size;
- 过度属性为：阴影transition-property:text-shadow;
CSS代码：
.transition-property{overflow:hidden;margin:0px;padding:0px;list-style:none;}
.transition-property li{width:300px;height:60px;margin-bottom:10px;padding:6px;border:1px solid #ab9595;background-color:#e3e2e0;}
.transition-property li.bgcolor{transition-property:background-color;transition-duration:.5s;transition-timing-function:ease;}
.transition-property li.bdcolor{transition-property:border-color,border-width;transition-duration:.5s;transition-timing-function:ease-in;}
.transition-property li.color{transition-property:color;transition-duration:.6s;transition-timing-function:ease-in-out;}
.transition-property li.fontsize{transition-property:font-size;transition-duration:.5s;transition-timing-function:ease-in;}
.transition-property li.textshadow{transition-property:text-shadow;transition-duration:.6s;transition-timing-function:ease-in-out;}
.transition-property li:nth-child(1):hover{background-color:#ff0030;}
.transition-property li:nth-child(2):hover{border-color:#0042ff; border-width:medium;}
.transition-property li:nth-child(3):hover{color:#b21a06;}
.transition-property li:nth-child(4):hover{font-size:18px;}
.transition-property li:nth-child(5):hover{box-shadow:2px 2px 3px 3px rgba(200, 199, 199, .6);}
效果图：
过度属性为：背景颜色
transition-property:background-color;
过度属性为：边框颜色和宽度
transition-property:border-color,border-width;
过度属性为：字体颜色
transition-property:color;
过度属性为：字体大小
transition-property:font-size;
过度属性为：阴影
transition-property:text-shadow;
可选为过渡的属性：
属性名称类型
transformall
background-colorcolor
background-imageonly gradients
background-positionpercentage, length
border-bottom-colorcolor
border-bottom-widthlength
border-colorcolor
border-left-colorcolor
border-left-widthlength
border-right-colorcolor
border-right-widthlength
border-spacinglength
border-top-colorcolor
border-top-widthlength
border-widthlength
bottomlength, percentage
colorcolor
croprectangle
font-sizelength, percentage
font-weightnumber
grid-*various
heightlength, percentage
leftlength, percentage
letter-spacinglength
line-heightnumber, length, percentage
margin-bottomlength
margin-leftlength
margin-rightlength
margin-toplength
max-heightlength, percentage
max-widthlength, percentage
min-heightlength, percentage
min-widthlength, percentage
opacitynumber
outline-colorcolor
outline-offsetinteger
outline-widthlength
padding-bottomlength
padding-leftlength
padding-rightlength
padding-toplength
rightlength, percentage
text-indentlength, percentage
text-shadowshadow
toplength, percentage
vertical-alignkeywords, length, percentage
visibilityvisibility
widthlength, percentage
word-spacinglength, percentage
z-indexinteger
zoomnumber
