CSS3 transition-property 屬性
實(shí)例
把鼠標(biāo)指針放到 div 元素上,會(huì)產(chǎn)生帶有平滑改變?cè)貙挾鹊倪^渡效果:
div { transition-property:width; -moz-transition-property: width; /* Firefox 4 */ -webkit-transition-property:width; /* Safari 和 Chrome */ -o-transition-property:width; /* Opera */ }
瀏覽器支持
Internet Explorer 10、Firefox、Opera 和 Chrome 支持 transition-property 屬性。
Safari 支持替代的 -webkit-transition-property 屬性。
注釋:Internet Explorer 9 以及更早版本的瀏覽器不支持 transition-property 屬性。
定義和用法
transition-property 屬性規(guī)定應(yīng)用過渡效果的 CSS 屬性的名稱。(當(dāng)指定的 CSS 屬性改變時(shí),過渡效果將開始)。
提示:過渡效果通常在用戶將鼠標(biāo)指針浮動(dòng)到元素上時(shí)發(fā)生。
注釋:請(qǐng)始終設(shè)置 transition-duration 屬性,否則時(shí)長為 0,就不會(huì)產(chǎn)生過渡效果。
默認(rèn)值: | all |
---|---|
繼承性: | no |
版本: | CSS3 |
JavaScript 語法: | object.style.transitionProperty="width,height" |
語法
transition-property: none|all|property;
值 | 描述 |
---|---|
none | 沒有屬性會(huì)獲得過渡效果。 |
all | 所有屬性都將獲得過渡效果。 |
property | 定義應(yīng)用過渡效果的 CSS 屬性名稱列表,列表以逗號(hào)分隔。 |