Q: 很多免費的現成的套件可以直接套用就有效果，拿來用吧？
A: 真的有比較好用嗎？
網頁的組成離不開html的架構及css的樣式，除了放上會動的圖片之外，css提供多種屬性可以讓元素有動態效果，讓你的網頁不再只是死板板沒有互動感。網路上有許多css相關的套件，只要加上class就可以讓元素有動態效果，如果團隊從一開始就有使用特定套件的習慣，會是非常方便的選擇，同時也省去很多寫效果的時間！
但不論是小編的團隊或是個人開發，若不是用Angular做大型專案開發，就是簡易的多頁式展示網站，對於套件(庫)的選用是能不使用第三方套件就絕對不會把套件引進專案的！秉持這樣的信念，想要的效果都自己寫。畢竟以大型專案來說，可以依賴的套件是越少越好；以簡易的展示網站來說，也沒有使用套件的必要。當然最後還有一個很重要的原因是當作練功，別人寫得出來的效果，自己也是可以寫寫看的！
接下來的文章將會介紹各式各樣的「微動畫」，透過操作css的屬性，並且在部分文章中會搭配javascript做實際應用，讓網站看起來更有質感。另外本系列會針對操作動態效果的css屬性特別做介紹，其餘如height、position、margin等等比較基礎的css屬性就不另外說明。
製作「微動畫」時操控的css屬性不同，所需的渲染成本也會不一樣，系列的最後會特別說明如何選用要操控的css屬性，可以將渲染的成本最小化。
iThome鐵人賽
看影片追技術