码迷,mamicode.com
首页 > 编程语言 > 详细

【Material Design视觉设计语言】UI组件设计(六):分隔线

时间:2015-08-28 13:19:22      阅读:138      评论:0      收藏:0      [点我收藏+]

标签:

作者:郭孝星
微博:郭孝星的新浪微博
邮箱:allenwells@163.com
博客:http://blog.csdn.net/allenwells
Github:https://github.com/AllenWells

分隔线 (Dividers) 主要用于管理和分隔列表和页面布局内的内容,以便让内容生成更好的视觉效果及空间感。

一 分隔线的功能

分隔线主要用来分隔没有锚点的项。

当在列表中没有像头像或者是图标之类的锚点元素时,单靠空格并不足以用于区分每个数据项。这种情况下使用一个等屏宽的分隔线就会帮助区别开每个数据项目。使其它看起来更独立和更有韵味。

技术分享

在使用分隔的子标题时,可以将分隔线置于子标题之上,可以加强子标题与内容关联度。

技术分享

二 分隔线的类型

2.1 等屏宽分隔线

等屏宽分隔线或以用于分隔列表中的每个数据项或者是页面布局中的不同类型的内容。

技术分享

2.2 内凹分隔线

在有锚点元素(头像或者是图标)并且有关键字的标题列中,我们可以使用内凹分隔线。

技术分享

版权声明:当我们认真的去做一件事的时候,就能发现其中的无穷乐趣,丰富多彩的技术宛如路上的风景,边走边欣赏。

【Material Design视觉设计语言】UI组件设计(六):分隔线

标签:

原文地址:http://blog.csdn.net/allenwells/article/details/48049979

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!