CSS3 transition-property 屬性

2018-07-22 21:43 更新

實例

把鼠標指針放到 div 元素上,會產(chǎn)生帶有平滑改變元素寬度的過渡效果:

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 屬性規(guī)定應用過渡效果的 CSS 屬性的名稱。(當指定的 CSS 屬性改變時,過渡效果將開始)。

提示:過渡效果通常在用戶將鼠標指針浮動到元素上時發(fā)生。

注釋:請始終設置 transition-duration 屬性,否則時長為 0,就不會產(chǎn)生過渡效果。

默認值: all
繼承性: no
版本: CSS3
JavaScript 語法: object.style.transitionProperty="width,height"

語法

transition-property: none|all|property;
描述
none 沒有屬性會獲得過渡效果。
all 所有屬性都將獲得過渡效果。
property 定義應用過渡效果的 CSS 屬性名稱列表,列表以逗號分隔。
以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號