99热在线精品一区二区三区_国产伦精品一区二区三区女破破_亚洲一区二区三区无码_精品国产欧美日韩另类一区

本篇文章給大家?guī)淼膬?nèi)容是關于css3中如何利用transition實現(xiàn)鼠標懸停的時候div的顏色、高度和寬度都改變的效果，有一定的參考價值，有需要的朋友可以參考一下，希望對你有所幫助。

創(chuàng)新互聯(lián)公司專注于企業(yè)全網(wǎng)營銷推廣、網(wǎng)站重做改版、隆昌網(wǎng)站定制設計、自適應品牌網(wǎng)站建設、HTML5、商城網(wǎng)站建設、集團公司官網(wǎng)建設、成都外貿(mào)網(wǎng)站制作、高端網(wǎng)站制作、響應式網(wǎng)頁設計等建站業(yè)務，價格優(yōu)惠性價比高，為隆昌等各大城市提供網(wǎng)站開發(fā)制作服務。

我們平時在瀏覽web網(wǎng)頁的時候會見到這樣一種情況：當鼠標懸停的某個區(qū)域的時候，該區(qū)域的形狀會在指定時間內(nèi)進行放大或者縮小的變化，甚至在變化大小的同時會出現(xiàn)顏色的漸變。這種特殊效果是如何實現(xiàn)的呢？現(xiàn)在由我來向大家介紹一下在css3中如何使用transition屬性和hover屬性實現(xiàn)div顏色漸變和放大縮小的效果。

css3中transition屬性

transition屬性是一個簡寫屬性，用于四個過度屬性，分別是transition-property，transition-duration，transition-timing-function和transition-delay。

1. transition-property：要運動的樣式（默認值為all，可以有三種定義：all、attr和none）

2. transition-duration：運動時間（只有運動時間是必需值并且不能為0，否則transition不會有任何效果）

3. transition-timing-function：運動形式（用法包括以下六種）

   ease：（逐漸變慢）
              linear：（勻速）
              ease-in：(加速)
              ease-out：（減速）
              ease-in-out：（先加速后減速）
              cubic-bezier 貝塞爾曲線：（ x1, y1, x2, y2 ）

   注意：其中如果沒有定義的話，transition-timing-function默認值為ease。

4. transition-delay：延遲時間（默認值為0）

transition屬性和瀏覽器的兼容（根據(jù)W3C標準）

Internet Explorer 10、Firefox、Opera和Chrome等高版本瀏覽器支持transition屬性標準寫法。Safari支持替代的-webkit-transition 屬性。但是Internet Explorer 9以及更早版本的瀏覽器不支持transition屬性。

css3鼠標移入特效的實現(xiàn)代碼

css3鼠標移入特效實現(xiàn)效果如圖所示

以上就是css3鼠標移入特效：如何實現(xiàn)div顏色漸變和放大縮小的效果的詳細內(nèi)容，更多請關注創(chuàng)新互聯(lián)網(wǎng)站制作公司其它相關文章！

文章題目：css3實現(xiàn)鼠標移入div發(fā)生顏色漸變和放大縮小-創(chuàng)新互聯(lián)
文章URL：http://www.ef60e0e.cn/article/ccdjjp.html