8款超酷而實用的CSS3按鈕動畫

一、CSS3分享按鈕動畫特效

這是一款基於CSS3的社會化分享按鈕，按鈕很是簡單，提供了分享到twitter、facebook、youtube等大型社交網站。每個分享按鈕都有個大社交網站的Logo圖標，而且在鼠標滑過這些按鈕時，利用CSS3的動畫特性出現滑動的動畫效果。

在線演示

源碼下載

二、HTML5/CSS3懸浮按鈕特效 Canvas綵球飛舞效果

此次要分享一個很是具備動畫色彩的CSS3按鈕，按鈕的外觀比較通常，但它有兩個特別的地方：1、按鈕懸浮，整個按鈕看上去像是懸浮在半空中同樣，很立體；2、點擊按鈕時利用HTML5 Canvas繪製綵球飛舞的效果，很是炫酷。

在線演示

源碼下載

三、純CSS3實現發光動畫按鈕特效

這是一款基於純CSS3的發光按鈕，按鈕發光的顏色是隨機的，這樣一排按鈕就顯得五彩繽紛，很是絢麗。以前咱們也介紹過很多樣式很獨特的CSS3按鈕，好比純CSS3 3D開關按鈕、純CSS3實現動感彈性按鈕等，都很是不錯，也有HTML5動畫按鈕，你們能夠本身看看。

在線演示

源碼下載

四、純CSS3動畫按鈕 可左右滑動

利用CSS3的一些動畫屬性，咱們可讓一些平凡的按鈕變得生動有趣，提升用戶體驗。今天分享的這款CSS3動畫按鈕就很是特別，只要你用鼠標滑過按鈕，按鈕的背景就會出現一個很可愛的滑塊背景，這個滑塊背景能夠左右滑動，鼠標移出按鈕時，又會將滑塊移出，看下面的按鈕演示，很是動感。

在線演示

源碼下載

五、純CSS3背景漸變按鈕 按鈕圖標淡入淡出動畫

今天咱們要再來分享一款純CSS3實現的按鈕動畫，這款按鈕動畫有如下特色：當鼠標滑過按鈕時，按鈕上的小圖標便會以爆炸的方式淡出按鈕，取代它的時相應的文字，當鼠標離開按鈕時，小圖標又會以爆炸的方式淡入按鈕中。更多CSS3按鈕，咱們能夠在CSS3按鈕欄目中查找。

在線演示

源碼下載

六、純CSS3實現動感彈性按鈕

今天咱們來分享一款頗有意思的CSS3按鈕，當你把鼠標滑過按鈕時，整個按鈕就會全身扭動起來，像是有彈性同樣，很是動感。另外，按鈕的結構很是簡單，你能夠經過合適的配色，讓按鈕更加貼切你的網站.

在線演示

源碼下載

七、CSS3圓角動畫按鈕 按鈕顏色豐富

前面剛剛分享過一款CSS3實現的分享按鈕，很是簡單實用。如今在來分享一款CSS3按鈕，首先這款CSS3按鈕是圓角的，正常狀況下有着不一樣顏色的邊框線，按鈕是空心的，鼠標滑過按鈕時，按鈕即以淡入的效果填充背景色，鼠標移出時又以淡出的效果取消背景色，是一款簡單而又實用的CSS3按鈕。

在線演示

源碼下載

八、CSS3 3D彈性按鈕效果 帶彈性質感

今天要分享的這款CSS3按鈕和這款按鈕差不錯，也一樣擁有3D的效果，按鈕在按下時帶有彈性質感。

在線演示

源碼下載

本文固定連接: http://www.i7758.com/archives/1261.html