---
title: Tag 标签
description: 用于标记关键词和概括主要内容。
isComponent: true
usage: { title: "", description: "" }
spline: message
author: swimly
---

## 基本用法

通过`content`和`default`可设置标签的文本内容，支持插槽和属性设置。

{{ base }}

## 不同主题

通过`theme`可设置不同颜色的标签，可选：`default` `primary` `warning` `success` `danger`，默认为：`default`。

{{ theme }}

## 不同形式

通过`variant`可设置不同形式的标签，适用所有颜色主题，可选：`dark` `light` `outline` `light-outline`，默认为：`dark`

{{ variant }}

## 不同形状

通过`shape`可设置不同形状的标签，主要用来控制圆角，可选：`round` `mark` `square`。

{{ shape }}

## 不同大小

通过`size`可设置标签的大小，可选：`small`，`medium`，`large`，默认为：`medium`。

{{ size }}

## 带图标

通过`icon`属性或者插槽可设置标签前面的图标，仅做装饰作用。

{{ icon }}

## 超出省略

通过`max-width`属性可设置标签的最大宽度，当超出此宽度的时候会自动省略。

{{ ellipsis }}

## 可编辑

通过设置`closable`属性，让标签可编辑，这时候标签后面会出现一个关闭图标，点击的时候会触发`close`事件。

{{ editable }}
