這篇文章給大家分享的是有關(guān)css3中transition-duration屬性的使用方法的內(nèi)容。小編覺得挺實(shí)用的，因此分享給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧。

創(chuàng)新互聯(lián)建站是一家集網(wǎng)站建設(shè),武邑企業(yè)網(wǎng)站建設(shè),武邑品牌網(wǎng)站建設(shè),網(wǎng)站定制,武邑網(wǎng)站建設(shè)報(bào)價(jià),網(wǎng)絡(luò)營(yíng)銷,網(wǎng)絡(luò)優(yōu)化,武邑網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè)，幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強(qiáng)企業(yè)競(jìng)爭(zhēng)力?？沙浞譂M足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時(shí)我們時(shí)刻保持專業(yè)、時(shí)尚、前沿，時(shí)刻以成就客戶成長(zhǎng)自我，堅(jiān)持不斷學(xué)習(xí)、思考、沉淀、凈化自己，讓我們?yōu)楦嗟钠髽I(yè)打造出實(shí)用型網(wǎng)站。

css3 transition-duration屬性用于規(guī)定完成過(guò)渡效果需要花費(fèi)的時(shí)間（以秒或毫秒計(jì)），語(yǔ)法為transition-duration: time。當(dāng)time值為0是，意味著不會(huì)發(fā)生過(guò)渡效果。

CSS3  transition-duration屬性

作用：transition-duration 屬性規(guī)定完成過(guò)渡效果需要花費(fèi)的時(shí)間（以秒或毫秒計(jì)）。

語(yǔ)法：

transition-duration: time;

參數(shù)：

time：規(guī)定完成過(guò)渡效果需要花費(fèi)的時(shí)間（以秒或毫秒計(jì)）。默認(rèn)值是 0，意味著不會(huì)有效果。

注：Internet Explorer 9 以及更早版本的瀏覽器不支持 transition-duration 屬性；Internet Explorer 10、Firefox、Opera 和 Chrome 支持 transition-duration 屬性。Safari 支持替代的 -webkit-transition-duration 屬性。

CSS3  transition-duration屬性的使用示例

請(qǐng)把鼠標(biāo)指針移動(dòng)到紅色的 div 元素上，查看過(guò)渡效果。
2秒過(guò)渡：

5秒過(guò)渡：

注釋：本例在 Internet Explorer 中無(wú)效。

效果圖：

感謝各位的閱讀！關(guān)于css3中transition-duration屬性的使用方法就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，讓大家可以學(xué)到更多知識(shí)。如果覺得文章不錯(cuò)，可以把它分享出去讓更多的人看到吧！