transition-property [过渡的CSS属性]

`transform`呈现的是一种变形结果，而`Transation`呈现的是一种过渡，通俗点说就是一种动画转换过程，如渐显、渐弱、动画快慢等。`transition`和`transform`是两种不同的动画模型。http://www.w3.org/TR/css3-transitions/

transition可以和Transform同时使用。

transition是一个复合属性，可以同时定义<code>transition-property</code>、<code>transition-duration</code>、<code>transition-timing-function</code>、<code>transition-delay</code>子属性值。

### 语法
```css
/*设置要以动画方式变换的CSS属性。*/
transition-property: all | none | <property>[ ,<property> ]*;
```
<table class="table"><thead><tr><th width="20%">语法项目</th><th>说明</th></tr></thead><tbody><tr><td>初始值</td><td>all</td></tr><tr><td>适用于</td><td>所有元素，以及:before和:after伪元素</td></tr><tr><td>可否继承</td><td>否</td></tr><tr><td>媒介</td><td>视觉</td></tr><tr><td>版本</td><td>CSS3.0</td></tr></tbody></table>

### 说明
`transition-property`可以设置要以动画方式变换的CSS属性，默认值all表示变换所有的属性，如果只针对单个或者多个CSS属性进行变换，就可以用这个属性来进行单独设置。

### 取值
`all`：表示针对所有元素。

`none`：表示没有元素。

`ident`：指定CSS属性列表。

### 实例代码
<iframe src="http://example.itshubao.com/inexample/434.html" width="100%" height="180px" frameborder="0" scrolling="no"></iframe>

### 兼容性
<table class="table"><thead><tr><th class="ie" width="20%">IE</th><th class="firefox" width="20%">Firefox</th><th class="opera" width="20%">Opera</th><th class="safari" width="20%">Safari</th><th class="chrome" width="20%">Chrome</th></tr></thead><tbody><tr><td>IE 10+</td><td>Firefox 3.7+</td><td>Opera 10.50+</td><td>Safari 3.2+</td><td>Chrome 2.0+</td></tr></tbody></table>