概览 - Mintlify

结构化内容

Tabs \ \ 将相关内容组织成可切换的标签视图。

代码组 \ \ 以多种语言显示代码示例。

步骤 \ \ 以编号格式显示分步说明。

列 \ \ 在响应式布局中将内容并排排布。

面板 \ \ 创建用于呈现补充内容的侧边栏面板。

吸引注意力

标注 \ \ 使用带样式的警示提示突出重要信息。

横幅 \ \ 在页面顶部显示醒目的公告。

徽章 \ \ 添加行内标签和状态指示器。

更新 \ \ 突出显示新的或已更新的内容。

框架 \ \ 为图片和内容添加边框和样式效果。

工具提示 \ \ 鼠标悬停时显示更多信息。

展示 AI 提示

Prompt \ \ 展示可复制的 AI 提示，并支持与 Cursor 集成。

显示和隐藏内容

折叠面板 \ \ 可展开的部分，用于分步展示内容。

可展开区域 \ \ 按需显示和隐藏详细内容。

视图 \ \ 根据上下文有条件地显示内容。

MDX \ \ 在 JSX 表达式和条件语句中渲染 Markdown。

Visibility \ \ 控制向人类和 AI 代理显示的内容。

为 API 编写文档

字段 \ \ 展示参数和属性的定义。

响应 \ \ 记录 API 响应的结构和字段。

示例 \ \ 将请求和响应示例并排展示。

链接到其他页面

卡片 \ \ 使用可自定义的容器和图标突出展示内容。

磁贴 \ \ 以可点击的磁贴网格形式展示内容。

添加视觉上下文

图标 \ \ 使用 Lucide 图标库添加视觉提示。

Mermaid 图表 \ \ 创建流程图、时序图等。

颜色 \ \ 展示带十六进制值的颜色样本。

Tree \ \ 展示文件和文件夹的层级结构。

GitHub \ \ 嵌入 GitHub 仓库卡片，实时显示 star 和 fork 数量。

设置组件样式

所有内置组件都接受 className prop。Mintlify 会将你的类与组件自身的样式合并，因此你无需额外包裹标记或编写 CSS 覆盖，即可重新设置单个实例的样式。

className example

<Note className="mt-0">This callout has no top margin.</Note>

可以使用 Tailwind CSS 类，包括诸如 w-[350px] 之类的 任意值，或你在 自定义 CSS 文件 中定义的类名。Banner、 MDX 和 Visibility 不接受 className。横幅在 docs.json 中配置，另外两个组件则直接渲染其子元素，没有包裹元素。