幾個好玩又好學的前端小游戲
對於新手小白學習前端來說，CSS的布局可謂是學習路上的一大攔路虎。雖然它看起來簡單，但實際上各種靈活多變的用法可是讓小白們頭疼不已呀！
下面給大家推薦幾個好玩有趣的小網站來幫助新手更好的了解和掌握前端，相信通過這幾個網頁小游戲，你一定可以對CSS的布局理解更上一層樓！（隨文附游戲網址）
1.Flex Froggy
通過代碼來幫助可愛的小青蛙回到屬於它們自己顏色的荷葉上，可以幫助我們進一步熟悉Flex布局的屬性和值。一共有24個小節，每個操作都很簡單，還有非常友好的詳細提示來幫助大家完成代碼。
點此跳轉到Flex Froggy
2.Flexbox Defence
這是一個塔防游戲，也是用來熟悉Flex布局的小游戲。用對應的flex屬性來控制炮塔放置的位置，布局到滿意的位置后，點擊“開始戰斗”后就請享受打敗敵人的快感吧！
點此跳轉到Flex Defence
3.Grid Garden
跟第一個小青蛙差不多，這次換成了給胡蘿卜澆水。控制對應的grid參數來給胡蘿卜澆水並把荊棘放回泥沼。這個小游戲可以很好的幫助我們熟悉Grid布局的屬性、更深入的理解grid布局如何操作。
點此跳轉到Grid Garden
4.CSS Diner
與前面三個都不太一樣，這是一個最打基礎的小游戲。游戲一共有32個關卡，每個關卡都需要輸入正確的選擇器才能把各式各樣晃動的物品從卡住的地方“救”出來。在左側白色部分寫選擇器，右側則是對應部分的html代碼。這個小游戲可以很快讓我們上手選擇器的使用，也能幫助我們更快速的了解選擇器的具體使用效果。
點此跳轉到CSS Diner