结构化展示精简信息的一种方式。

适用

  • 标记事务的属性、维度、状态
  • 将事务分类
  • 过滤同属性内容
  • 展示差异化信息,辅助区分标记主体

通用原则

  • 标签应与所标记的内容有明确而有用的关系
  • 标签具有体积小,信息紧凑的特质,不建议标签内使用大段文本

类型

类型 何时使用
无操作标签 展示静态信息
可操作标签 有交互行为

无操作标签

  • 仅文本:静态文本标记对象特征或属性
  • 带图标:常用于对于标签状态的表达,比如延期,截止时间等

image.png

可操作标签

提供:选中、删除、跳转等能力。
image.png

构成

image.png

  1. 容器
  2. 内容
    1. 图形(可选)
    2. 文本
      1. 通常为短语或词语
      2. 不允许折行,不允许省略
  3. 操作(可选)

行为

四大状态

image.png

删除

标签可被移除:点击删除icon可移除指定标签,常用于表格、输入框内

点击跳转

标签本身带链接:点击后跳转至标签内容所属页面(注:标签内字段为目的地描述字段,动作描述建议使用按钮)

选中

标签可选中:同类条目里选择单/多项,多配合表格、表单使用(注:至少有两个标签)