萬事起頭難的第一篇，先求有再求好，學習筆記原本習慣手寫再筆記本上，但看到了此次挑戰，覺得可以增進自己的前端技術，還可以留個紀錄，也是蠻不錯的（雖然可能會變成未來的黑歷史XD）
學習過程中經常一個樣式就卡關卡超久，例如：用css自定義radio按鈕樣式。下圖為最終呈現的樣子。
以下為html，製作過程中還發現，raio雖然為單選，但必須設定一樣的name才會真的變單選，若沒有設定，則都能同時被選取。
再來是css樣式設定，主要就是把原本預設醜醜的input給影藏起來，然後再用label做成input的radio底部樣式，用label做的用意是這樣點擊時才會被觸發。
利用:before偽元素製作選取後的內部藍色原點。
使用:checked偽類選擇器，當input被選取時，藍色原點就會顯示。
其實還有其他方法，例如使用圖片替換，之後再研究好了……..（汗..|||）打完收工！
#w3HexSchool #鼠年全馬鐵人挑戰
