用法
分隔线通过建立页面上的视觉节奏和层次结构,帮助用户理解内容的组织方式。但过度使用分隔线会导致视觉干扰并削弱其效果。
通栏分隔线强调独立的内容区域和章节,但如果不需要如此明显的分隔,可考虑使用空白、子标题或内嵌分隔线。
无锚定元素的项目
当列表没有锚定元素(如头像或图标)时,仅靠间距通常不足以分隔区块。这种情况下,通栏分隔线有助于创建节奏并分隔独立的区块。

通栏分隔线分隔邮件摘要。

通栏分隔线分隔邮件界面的发件人、收件人、主题和正文部分。
基于图像的内容
由于网格本身会创建视觉差异,网格列表不需要用分隔线将子标题与内容分开。这种情况下,空白和子标题已能充分分隔各部分。

空白和子标题分隔了照片和相册。

推荐做法
明智地使用内嵌分隔线来划分内容的主要部分。

推荐做法
内嵌分隔线与锚定元素(如头像)结合使用。

不推荐做法
过度使用通栏分隔线会造成视觉干扰,并最终削弱分隔线的意义。

不推荐做法
内嵌分隔线有助于减少视觉干扰,应与锚定元素一起使用,但过度使用会降低其意义。







