📚 深度解析：圆角生成器
💡 常见使用场景
- 可视化调出 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），两端被裁成半圆即胶囊。