分割线

Divider

初级通用

分割线（Divider）是用线条或细长留白标出界面中相邻内容边界的视觉元素。它让你在不增加卡片等容器的情况下看清分组，例如区分设置页里的账户选项和通知选项。

你可能会说：「设置页的几组选项挨得太近了，能不能加一道细线，让人看出哪里换了组？」

动手看看设置页的分组边界

个人设置

账户资料

密码与安全

推送通知

已开启

每周邮件摘要

每周一

分隔方式

切换分隔方式，看看账户与通知两组内容的边界。悬停列表行或用 Tab 聚焦可看到操作反馈；分割线本身不参与交互。

细线明确告诉你“下面换一组了”，适合选项较多、空间有限的设置页。只在组间画线，不必给每一行都加一道边界。

1
先判断内容是否真的分组
分割线表达的是「这里告一段落，下面是另一组」。比如账户设置和通知设置放在同一个面板里，加一条线能帮你扫清组与组的边界；如果内容本来就是连续的一段，画线反而会打断阅读。
2
用间距配合线条表达关系
线两侧的距离也会影响理解。你可以让同组项目靠近一些，让分割线与两组内容都留出空间。这样用户看到的是两个内容组，而不只是页面中间多了一道装饰线。
3
让分割线保持辅助地位
分割线通常不承载操作，也不需要像按钮那样醒目。在后台列表里，如果每行都用很重的线框住，页面会变得拥挤。你可以先用较轻的线区分行，再看行间距能否让内容保持清楚。

分割线和边框都可能是一条线，但边框围住某个元素，分割线强调相邻内容之间的界限。它也不等于间距：留白同样能分组，而且不增加视觉元素；当留白不足以说明边界，或内容排得较密时，我们才更可能加一条分割线。

你在做一个账户设置页。「登录安全」和「消息通知」各有几项开关，放在同一个面板里，用户常把两组看成一组。你会怎么调整？

请检查账户设置页中「登录安全」和「消息通知」两组选项的排布。在两组之间加入分割线，并配合间距标出分组边界；保留现有开关的顺序和功能，不要把两组改成标签页或独立卡片。