mintlify__docs/zh/components/callouts.mdx

---
title: "标注框"
description: "添加 info、note、tip、check、warning、danger 和自定义标注框组件，在文档中突出显示重要信息。"
keywords: ["callouts", "notes", "warnings", "info boxes", "tips", "emphasis", "highlight"]
boost: 3
---

import IconsOptional from "/snippets/zh/icons-optional.mdx";

将标注框设置为 Note、Warning、Info、Tip、Check、Danger，或创建你自己的标注框：

<Note>这会在内容中添加一条说明</Note>

```mdx
<Note>这会在内容中添加一条说明</Note>
```

<Warning>这会触发一个 Warning，提醒注意</Warning>

```mdx
<Warning>这会触发一个 Warning，提醒注意</Warning>
```

<Info>用于提示关键信息</Info>

```mdx
<Info>用于提示关键信息</Info>
```

<Tip>这是一条有用的提示</Tip>

```mdx
<Tip>这是一条有用的提示</Tip>
```

<Check>这将使其处于“已选中”状态</Check>

```mdx
<Check>这将使其处于"已选中"状态</Check>
```

<Danger>这是一个危险提示框</Danger>

```mdx
<Danger>这是一个危险提示框</Danger>
```

<Callout icon="key" color="#FFC107" iconType="regular"> 这是一个自定义标注</Callout>

```mdx wrap
<Callout icon="key" color="#FFC107" iconType="regular">这是一个自定义标注</Callout>
```

<div id="custom-callout-properties">
  ## 自定义标注框属性
</div>

通用 `Callout` 组件支持自定义图标和颜色。带类型的标注框（`Note`、`Warning`、`Info`、`Tip`、`Check`、`Danger`）使用预设的图标和颜色，仅接受 `children`。

<IconsOptional />

<ResponseField name="color" type="string">
  自定义颜色，使用十六进制色值（例如 `#FFC107`）。设置标注框的边框、背景色调和文本颜色。
</ResponseField>