分割线布局
它用一条细线或明显间隔把相邻内容分组,让层级和阅读边界更清楚。
- 两块内容中间那条细线
- 列表每一项之间的横线
- 把上下内容隔开的线
- 内容分隔线
- 分隔符
- 区块分界线
示例
尚无经验证的示例
这条词条暂时只提供平台定义和出处,不用临时动画冒充正式内容。
Web / iOS / Android 对照
Web原生支持
桌面与移动端现代浏览器
Thematic Break
也叫 Divider
<hr>
只有主题发生转换时使用 hr;纯装饰线可以用边框,但不应添加多余语义。
iOS原生支持
iOS / iPadOS
Divider
SwiftUI: Divider
Android原生支持
Android 手机 / 平板
Divider
Compose Material 3: HorizontalDivider / VerticalDivider
使用规范
什么时候用
- 相邻内容属于不同分组,仅靠留白仍不够清楚
什么时候别用
- 每一项都加线造成视觉噪声,或内容本身没有分组关系
容易混淆
给 AI 的提示词
这条词条还没有经过验证的实现提示词。