Target #6 - Missing Slice

撰寫思維

• 水平及垂直置中方式一樣採用flex的語法達成。
• 而圖形的組合則是看成半圓＋四分之一的圓即可。

最後結果

附上 codepen(CSSBattle 目前無法透過附上連結看到別人所寫的程式碼，所以我另外寫在 codepen 方便點擊。可直接複製貼上即可查看結果)

#6 Missing Slice

圓角的設定同前一篇記錄的分享 連續記錄挑戰Day07-5-Acid-Rain，可以針對四個角做出特定的設定。而四分之一圓的設定步驟有兩個：

• 假設有一個圓形寬度及高度為200px，則四分之一圓形須將寬度及高度設定為圓形的一半

• 依照需求設定圓角的部分。

做到這關發現開始有些技巧都在重複運用了，剛好藉此機會可以更加了解及活用！