CSS Dinner
CSS Dinner 是一款關於 CSS 選擇器套用語法的遊戲。
要通過關卡你可能需要這一篇裡面的 CSS 知識：選擇器 class 與 id 以及階層關係
Flexbox Defense
Flexbox Defense 是一款關於 flex 的各種排列宣告遊戲。要用 CSS 來重新佈置砲塔的位置，佈置好後按Strt wave 就會有一些圈圈跑進來，砲塔會自動攻擊。
砲塔只有排在路徑的旁邊才會有作用。如果你沒耐心看那些圈圈慢慢跑，建議你玩下一個遊戲。
要通過關卡你可能需要這一篇的CSS知識：彈性排版 flex
FLEXBOX FROGGY
FLEXBOX FROGGY 跟上一個遊戲一樣是關於 flex 的排列，包含 justify-content, align-items, align-content, order, wrap 等等語法。
只要讓青蛙排列到荷葉上就可以了。
要通過關卡你可能需要這一篇的CSS知識：彈性排版 flex
GRID GARDEN
GRID GARDEN 是關於 grid 的CSS 語法遊戲，必須把水移到紅蘿蔔上面、把毒藥移到雜草上面。
內容需要用到 grid-template, grid-column-start, grid-row-start, fr, grid-auto-flow, order 等屬性。
如果對 grid 的語法還不是很熟，可以參考這一篇：格線 grid, 單位 fr
