摆内容
分隔线
Divider
「那条细线」「中间的分割线」「灰灰的一条线」「内容之间的横线」「隔开的细杠」「列表里的分隔」「一像素的线」
LIVE DEMO真实可交互，动手试试
上一段内容：设计令牌的命名规范。
下一段内容：组件状态与交互反馈。
内容分隔 hr
菜单分组 separator
行内分隔
- 英文名
- Divider
- 别名 · 俗称
- 分割线水平分隔线细线分隔shadcn: Separator
- Web 叫法
- <hr> / Separator
- 大白话定义
- 内容块之间那条细细的灰线，把上下左右的内容轻轻分开，省得留白太多。
- 部位拆解
- 线条 Line一像素左右的细线，横竖都有
- 间距 Spacing线上下留的呼吸空间
- 文案 Label可选，线中间嵌个「或」之类的小字
提示词已按当前平台组织好，复制粘贴给 AI 即可
Web
在表单两组字段之间加分隔线（Separator）：1px 浅灰横线，上下各留 16px 间距
调试 Prompt组件不听话时用——把症状补在末尾一起发给 AI
调试我的分隔线（Separator）。逐一排除：1px 线在高分屏被缩成半像素发虚，得用 transform 或 border 实现；深色模式下线条颜色没跟着变，黑底上直接看不见；相邻元素 margin 叠加，线两侧间距一边宽一边窄；竖分隔线高度没撑满，只露出短短一截。症状是：