css3中新增的transition屬性是什么

這篇文章主要為大家展示了“css3中新增的transition屬性是什么”，內(nèi)容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“css3中新增的transition屬性是什么”這篇文章吧。

　　在CSS3中新增加了一個(gè)新的模塊transition，它可以通過一些簡單的CSS事件來觸發(fā)元素的外觀變化，讓效果顯得更加細(xì)膩。

　　它是一個(gè)復(fù)合屬性，主要包括以下幾個(gè)子屬性。

　　transition-property:指定過渡或動(dòng)態(tài)模擬的CSS屬性

　　transition-duration:指定完成過渡所需的時(shí)間

　　transition-timing-function:指定過渡函數(shù)

　　transition-delay:指定開始出現(xiàn)的延遲時(shí)間

　　如：

　　transition:background-color.5sease.1s;

　　特別注意：當(dāng)“transition-property”屬性設(shè)置為all時(shí)，表示的是所有中點(diǎn)值的屬性。

　　示例：

　　width:200px;

　　height:200px;

　　background:red;

　　margin:20pxauto;

　　-webkit-transition-property:width;

　　transition-property:width;

　　-webkit-transition-duration:.5s;

　　transition-duration:.5s;

　　-webkit-transition-timing-function:ease-in;

　　transition-timing-function:ease-in;

　　-webkit-transition-delay:.18s;

　　transition-delay:.18s;

　　也可以對(duì)屬性進(jìn)行單個(gè)設(shè)置。

以上是“css3中新增的transition屬性是什么”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道！