# CSS3 transition-property 屬性 ## 實例 把鼠標指針放到 div 元素上，會產生帶有平滑改變元素寬度的過渡效果： ``` div { transition-property:width; -moz-transition-property: width; /* Firefox 4 */ -webkit-transition-property:width; /* Safari 和 Chrome */ -o-transition-property:width; /* Opera */ } ``` ## 瀏覽器支持 | IE | Firefox | Chrome | Safari | Opera | | --- | --- | --- | --- | --- | Internet Explorer 10、Firefox、Opera 和 Chrome 支持 transition-property 屬性。 Safari 支持替代的 -webkit-transition-property 屬性。 注釋：Internet Explorer 9 以及更早版本的瀏覽器不支持 transition-property 屬性。 ## 定義和用法 transition-property 屬性規定應用過渡效果的 CSS 屬性的名稱。（當指定的 CSS 屬性改變時，過渡效果將開始）。 提示：過渡效果通常在用戶將鼠標指針浮動到元素上時發生。 注釋：請始終設置 [transition-duration](/cssref/pr_transition-duration.asp "CSS3 transition-duration 屬性") 屬性，否則時長為 0，就不會產生過渡效果。 | 默認值： | all | | --- | --- | | 繼承性： | no | | --- | --- | | 版本： | CSS3 | | --- | --- | | JavaScript 語法： | _object_.style.transitionProperty="width,height" | | --- | --- | ## 語法 ``` transition-property: none|all|_property_; ``` | 值 | 描述 | | --- | --- | | none | 沒有屬性會獲得過渡效果。 | | all | 所有屬性都將獲得過渡效果。 | | _property_ | 定義應用過渡效果的 CSS 屬性名稱列表，列表以逗號分隔。 |