Divider / AspectRatio 分隔线与宽高比Divider · AspectRatio
Divider 是一条 1px 的发丝线，横竖都行，横向时中间可以带文字。AspectRatio 是一个固定宽高比的盒子，用来给图片、视频、地图这类内容预留位置。
Divider
分隔用发丝线（--ok-line），不描整圈。行与行之间、工具栏的分组之间用它。
横向与带文字
上面的内容下面的内容
或者
带文字的分隔线纵向
放在横向的 flex 容器里，高度自动撑满。
Divider 属性
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
orientation | 'horizontal' | 'vertical' | 'horizontal' | 线的方向。 |
children | ReactNode | — | 线中间的文字（仅横向）。 |
labelAlign | 'start' | 'center' | 'end' | 'center' | 文字的位置。 |
decorative | boolean | false | 纯装饰：不暴露给读屏（role="none"）。 |
…rest | HTMLAttributes | — | ref、className、style 和其余原生属性透传到根节点。 |
无障碍
- 默认 role="separator"；纵向时带 aria-orientation="vertical"。
- 带纯文字时，文字同时作为 aria-label。
- 只是视觉上隔开、没有“分组”含义时传 decorative，读屏不会念出一堆“分隔符”。
AspectRatio
盒子的宽度跟随外层，高度按比例算。直接子元素是 img、video、iframe、canvas 时自动铺满并裁切（object-fit: cover）。
16 / 9
AspectRatio 属性
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
ratio | number | string | 16 / 9 | 宽高比：数字（16 / 9）或 '16 / 9' 这样的字符串。 |
…rest | HTMLAttributes | — | ref、className、style 和其余原生属性透传到根节点。 |