---
title: 工具提示
description: 在悬停时显示定义和上下文。定义术语、解释缩略词，或链接到相关内容，同时避免页面杂乱。
---
> **For AI agents:** the complete documentation index is at [llms.txt](/docs/llms.txt). Append `.md` to any page URL for its markdown version.
添加悬停文本，以定义术语、解释缩略词，或链接到相关页面，同时避免主内容杂乱。
以下情况适合使用工具提示：
- **在行内定义术语**，不打断阅读流程
- **解释缩略词**，帮助可能不了解它们的读者
- **提供上下文**，补充有帮助但非必需的信息
- **链接到相关内容**，引导用户执行操作
## 基本工具提示
将鼠标悬停在 API 上，即可查看定义。
```jsx
API
```
## 添加标题
在提示文本上方添加标题：
将鼠标悬停在 API 上，即可查看带标题的定义。
```jsx
API
```
## 添加行动号召链接
添加链接，方便用户了解更多信息：
在我们的文档中了解 API。
```jsx
API
```
## 行内使用
工具提示可以与文本一起行内使用。你可以行内解释 HTML、CSS 或 JS 术语。
```jsx
Explain HTML,
CSS, or
JS terms inline.
```
## 工具提示与其他组件的区别
| 需求 | 组件 |
|------|-----------|
| 行内定义术语 | **Tooltip** |
| 详细解释概念 | Expandable 或单独的章节 |
| 警告重要事项 | Callout（Note、Warning） |
| 显示上下文代码 | CodeGroup 或行内代码 |
**经验法则：** 工具提示适合快速定义（1–2 句话）。更长的解释应放在主内容或 Expandable 中。
## 属性
悬停时显示的工具提示文本。
在提示文本上方显示的文本。
行动号召链接文本。
行动号召的 URL（与 `cta` 一起使用时必填）。
用于触发工具提示的文本。
## 无障碍
- 工具提示支持键盘访问（按 Tab 聚焦，聚焦时显示）
- 使用 `role="tooltip"` 为屏幕阅读器提供支持
- 触发文本带有虚线下划线，用于指示其可交互
## 下一步？
浏览所有可用组件
了解如何在 MDX 中使用组件