自從 css3 有了動畫功能，從此 web 頁面就邁進「忽如一夜春風來，千頁萬頁動畫開」的盛況。 所以 css 動畫除了是炫技之選更是一項基本技能，當然也就有無數前輩為之嘔心瀝血總結經驗了。這裡我們站在巨人肩上，為大家推薦一些常見且十分好用的 css 動畫庫，既可以用來學習也可用來提高工作效率。
animate.css 是最早的也是目前最流行和最易於使用的css動畫庫之一，其包含了60多款不同型別的 css 動畫如晃動、閃動、淡出淡出效果等，如果你想快速的使用各種 css 動畫特效的話，你可以選擇它。
發行：2023年
當前版本：3.5.2
人氣：github上有40000+的star
未壓縮大小：72kb
magic css3 animations 是乙個特殊效果的 css 動畫庫，你可以免費用於你的 web 專案，簡單的引用 css 樣式：magic.css 或 magic.min.css （壓縮版）即可。該專案提供了乙個特別酷的演示應用程式。與 animate.css 相比，magic css3 animation 的大小適中，它的特色動畫，如魔法效果，愚蠢的效果和炸彈效果十分出眾和特別。
發行：2023年
當前版本：1.1.0
人氣：github上有4700+的star
未壓縮大小：20.5kb
發行：2023年
當前版本：2.1.1
人氣：github上有16000+的star
未壓縮大小：100+kb
發行：2023年
當前版本：0.5.0
人氣：github上有10900+的star
在頁面中，我們時常需要使用 gif 來實現比較炫酷的 loading 動畫。single element css spinners是乙個css螺旋載入動畫的集合。使用single element css spinners 來替代 gif 來實現螺旋載入動畫，不僅減少了請求的次數，同時還能夠通過**來靈活地修改動畫的引數。
發行：2023年
當前版本：1.0.0
人氣：github上有4700+的star
未壓縮大小：10kb
注：一般不建議全部拿來使用，而是使用哪個動畫效果就拷貝對應的樣式。
CSS3動畫常見屬性
屬性 描述 keyframes 定義動畫 animation 所有動畫屬性的簡寫屬性，除了animation play state animation name 規定 keyframes動畫的名稱 animation duration 規定動畫完成乙個週期所花費的秒或毫秒，預設是0 animatio...
CSS3動畫常見特效
transition all 2s 設定哪些屬性可以有過渡效果 all 所有的屬性 注意 並不是所有的屬性都可以過渡 transition property left,width transition duration 5s duration during 在 期間 設定完成過渡所需要的時間 tra...
Css3動畫庫收集
1.animate.css 齊全的css3動畫庫 2.angular官方動畫庫 3.animate.css 支援的動畫名稱 class name bounce flash pulse rubberband shake headshake swing tada wobble jello bouncei...