<basic-shape>:CSS 的八个形状函数
path 微语言能描述任意形状，但写一个圆角矩形也要拼出一串 A 弧。CSS 把常用形状做成了现成的函数，统称
<basic-shape>——这是一种独立的值类型，不属于任何单个属性：clip-path、shape-outside、offset-path 接受的都是它。本页全部交给 clip-path 来观察：形状内保留、形状外裁掉（露出棋盘格）。
1 · 逐个演示
这些函数原生支持百分比。 坐标 / 半径都能写 %（相对参照盒），盒子缩放形状跟着缩放——这正是 path() 做不到的（它只认无单位 px；上面选 path 试试，再想象盒子变宽的结果）。圆/椭圆还有四个关键字半径：closest-side / farthest-side / closest-corner / farthest-corner。
2 · 八个函数速查（含本浏览器实测）
三种矩形的差异。 inset() 说「从四条边往里缩多少」，rect() 说「四条边各落在哪」（top/bottom 从上边量，left/right 从左边量，沿用早期 clip 属性的语义）,xywh() 说「左上角 + 宽高」（与 viewBox 同一约定）。三者都支持
round <radius> 圆角，表达力等价，按习惯选择即可。
polygon() 的圆角顶点还在草案。 CSS Shapes Level 2 提案给 polygon() 也加了 round <length>（写在顶点列表之后，为每个顶点统一倒角），好处是圆角能用在所有接受 <basic-shape> 的属性上。但目前没有任何浏览器实现——round
关键字现阶段只有 inset() / rect() 这类矩形支持。想给多边形做圆角，当前要么改用更多顶点逼近，要么走 shape() 的弧线命令，或叠一层 border-radius。