Skip to content

标签

标签通常用于对内容进行标记。

使用方法

使用 .label 类来获得标签的外观和交互体验,通常用在元素 <span> 上。

标签

外观类型

配合丰富的CSS 工具类来实现不同标签的外观。

主要标签黑色标签描边浅色

尺寸

除了默认大小,标签还提供了额外的 2 种预设尺寸。

小标签普通大小大标签

圆角

通过工具类 rounded-* 来应用不同的圆角样式。

无圆角小圆角普通圆角中等圆角大圆角超大圆角完整圆角

圆点标签

当与工具类 label-dot 一起使用时则获得圆点标签。

与按钮组合使用

CSS 类

标签提供了如下 CSS 类:

类型作用
label实体类元素作为标签组件
label-dot工具类标签使用圆形外观
size-sm工具类标签使用小号尺寸
size-lg工具类标签使用大号尺寸

CSS 变量

变量名称变量含义
--label-bg标签背景色
--label-color标签文字颜色
--label-border-color标签边框颜色
--label-radius标签圆角