簡介：不用任何 JavaScript 腳本，使用純 CSS 實(shí)現(xiàn)頁面之間的平滑過渡，體驗(yàn) transform、transition、animation 帶來的神奇體驗(yàn)。
第1章 導(dǎo)航制作
分析動畫實(shí)現(xiàn)原理，編寫頁面結(jié)構(gòu)，及講解 input 和 label 配合: after、:before 的使用。
第2章 導(dǎo)航頁動畫制作
講解 @font-face 和 transform 中 rotate 的使用。
- 視頻： 2-1 導(dǎo)航頁面切換（1） (05:21)
- 視頻： 2-2 導(dǎo)航頁面切換（2） (08:29)
- 視頻： 2-3 導(dǎo)航頁面切換（3） (09:05)
- 視頻： 2-4 導(dǎo)航頁背影動畫制作（圖標(biāo)三角背景制作） (04:43)
- 視頻： 2-5 導(dǎo)航頁背影動畫制作（@font-face實(shí)現(xiàn)小icon） (14:15)
- 視頻： 2-6 導(dǎo)航頁背影動畫制作（animation與transition區(qū)別） (12:17)
- 視頻： 2-7 導(dǎo)航頁背影動畫制作（animation制作動畫） (11:09)
第3章 細(xì)節(jié)優(yōu)化及總結(jié)
對網(wǎng)頁動畫細(xì)節(jié)進(jìn)行補(bǔ)充，最后對課程進(jìn)行總結(jié)歸納。