📚 深度解析：圓角生成器
💡 常見使用場景
- 可視化調出 CSS border-radius 值
- 做卡片、按鈕、頭像的不同圓角
- 用百分比實現橢圓/膠囊形
語法
border-radius: 8px 生成四角等圓；可分別設四角 8px 16px 24px 12px（左上→右上→右下→左下）；用 50% 把方形變圓，用 999px 做膠囊按鈕。
獨立角
border-radius: 16px 16px 0 0 只圓上方兩角，做頂部卡片；用 / 可分橫縱半徑（如 50% / 20%）得橢圓角。
橢圓角
border-radius: 50% / 30% 給出橫縱半徑不同的瓣形，常用於擬物或裝飾元素。
❓ 常見問題（FAQ）
- 50% 為什麼變圓？
- 當半徑達到邊長一半時四角圓弧相接成整圓；正方形配 50% 為正圓，長方形配 50% 為橢圓。
- 膠囊形怎麼寫？
- 設 border-radius 為大於等於半高的值（如 height 40px 時設 999px 或 20px），兩端被裁成半圓即膠囊。