首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    Material Design — 分隔线(Dividers)

    Deviders 分隔线是一种轻量级的规则,它将列表和页面布局中的内容分组。 分隔线能将页面内容和层次结构组织成单个块。 全出血分隔线强调单独的内容区域和需要更明显的视觉分离的部分。...左:内置分隔线将主要部分分开    右:将分隔线与锚点元素结合使用 ?...分隔线滥用导致视觉噪声与分隔弱化 ---- 分隔线类型 全出血分隔线 全出血分隔线在列表和页面布局中分隔不同的内容部分(eg 联系人信息中的内容详情)或不同的内容元素(eg 列表项)。...全出血分隔线还可以展示材料中内容膨胀时材料将膨胀的材料中的分隔(如下图右)。 ? 内置分隔线 内置分隔线分隔相关内容,例如对话中的联系人列表或电子邮件列表中的部分。...内置分隔线应与锚点元素(eg 与标题对齐的图标或头像)一起使用。 ? 子标题和分隔线 将分隔线与子标题一起使用时,将分隔线放在子标题上方以加强子标题和内容之间的关系。 ?

    1.7K120

    Android 中为RecyclerView控件添加分隔线

    下面来看一下怎么对RecyclerView中的子项添加分隔线: 首先,我们要知道,要对RecyclerView控件中的子项添加分隔线,我们要利用RecyclerView.ItemDecoration...parent, RecyclerView.State state) { super.onDraw(c, parent, state); } // 也可以在这个方法中绘制分隔线...canvas); } } } } 代码看似有点多,但是主要的逻辑不复杂:对RecyclerView的子项排布方式进行判断,两个方法分别用于绘制线性布局的分隔线和网格布局的分隔线...我们注意到这里的分隔线使用了我们自定义的资源,因此,我们要在drawable文件夹中新建一个资源文件my_list_divider.xm: 分隔线就介绍的差不多了,RecyclerView控件相当于ListView控件的升级版,使用步骤也类似:定义控件、使用适配器添加数据、添加布局管理器、添加分隔线、添加动画效果等等

    2.1K10

    CSS实现自适应分隔线的N种方法

    具体实现如下 html结构为 我是分割线 css样式为 .title{ position: relative; text-align:...具体实现如下 html结构为 我是分割线 css样式为 .title{ display: flex; align-items: center...同样利用text-align: center使文本和伪元素居中,然后生成足够大的box-shadow或者outline,由于不支持单个方向,所以用clip-path或者clip裁剪掉 具体实现如下 html...伪元素+right:100% 这个实现需要多一层标签,外部仍然是text-align: center,内部文本里添加两个伪元素绝对定位,其中左边的设置距离右边100%(相对于文本标签)即可 具体实现如下 html...(伪元素+table-cell) 8.fieldset+legend 利用fieldset和legend标签组合,可以天然实现分隔线效果,参考至张鑫旭的这篇文章 具体实现如下 html结构为 <fieldset

    2.3K20

    markdown笔记

    显示格式: 样式一展开目录 字体五花八门,这里是斜体哦 这里也是呢 样式二展开目录 这里是粗体呢 这里也是哦 样式三展开目录 粗斜体来也 谁不是呢 ---- 这里是各种线的集合展开目录 介绍: 分隔线有六种写法...删除线:文字两侧加一个 ~ 下划线:文字两侧加 和 脚注:将需要标注的文字用 [^ ] 括起,并在下方输入解释(具体如下) 语法格式: ### 分隔线来了 写法: *** * *...显示格式: 分隔线来了展开目录 ---- ---- ---- ---- ---- (范例见上) 删除线展开目录 ~ 你好~ 下划线展开目录 我是下划线的内容 脚注展开目录 啊,这可真伤心 1!...---- 列表展开目录 介绍: 无须列表:前可用 */-/+ 表示单独的一项 列表嵌套:即在子列表选项前加四个空格或一个 Tab 有序列表:在子项之前加 1. 2. 3....https://www.bytecho.net/archives/1959.html

    37030
    领券