mirror of
https://github.com/mintlify/docs.git
synced 2026-09-14 13:35:46 +08:00
5cd2355062
Co-authored-by: locadex-agent[bot] <217277504+locadex-agent[bot]@users.noreply.github.com>
120 lines
3.4 KiB
Plaintext
120 lines
3.4 KiB
Plaintext
---
|
|
title: "概览"
|
|
description: "用于布局、强调、API 文档和导航的组件库。"
|
|
keywords:
|
|
["MDX 组件", "文档组件", "UI 组件", "组件"]
|
|
---
|
|
|
|
Mintlify 为你的文档页面提供了内置的 MDX 组件。使用这些组件来组织内容、突出重要信息、编写 API 文档,并引导读者在文档中导航。
|
|
|
|
<div id="structure-your-content">
|
|
## 结构化内容
|
|
</div>
|
|
|
|
<Card title="Tabs" icon="folder" href="/zh/components/tabs">
|
|
将相关内容组织成可切换的标签视图。
|
|
</Card>
|
|
|
|
<Card title="代码组" icon="code" href="/zh/components/code-groups">
|
|
以多种语言显示代码示例。
|
|
</Card>
|
|
|
|
<Card title="步骤" icon="list-ordered" href="/zh/components/steps">
|
|
以编号格式显示分步说明。
|
|
</Card>
|
|
|
|
<Card title="列" icon="columns-3" href="/zh/components/columns">
|
|
在响应式布局中将内容并排排布。
|
|
</Card>
|
|
|
|
<Card title="面板" icon="panel-right" href="/zh/components/panel">
|
|
创建用于呈现补充内容的侧边栏面板。
|
|
</Card>
|
|
|
|
<div id="draw-attention">
|
|
## 吸引注意力
|
|
</div>
|
|
|
|
<Card title="标注" icon="message-square-warning" href="/zh/components/callouts">
|
|
使用带样式的警示提示突出重要信息。
|
|
</Card>
|
|
|
|
<Card title="横幅" icon="flag" href="/zh/components/banner">
|
|
在页面顶部显示醒目的公告。
|
|
</Card>
|
|
|
|
<Card title="徽章" icon="award" href="/zh/components/badge">
|
|
添加行内标签和状态指示器。
|
|
</Card>
|
|
|
|
<Card title="更新" icon="bell" href="/zh/components/update">
|
|
突出显示新的或已更新的内容。
|
|
</Card>
|
|
|
|
<Card title="框架" icon="frame" href="/zh/components/frames">
|
|
为图片和内容添加边框和样式效果。
|
|
</Card>
|
|
|
|
<Card title="工具提示" icon="message-circle" href="/zh/components/tooltips">
|
|
鼠标悬停时显示更多信息。
|
|
</Card>
|
|
|
|
<div id="show-and-hide-content">
|
|
## 显示和隐藏内容
|
|
</div>
|
|
|
|
<Card title="折叠面板" icon="chevron-down" href="/zh/components/accordions">
|
|
可展开的部分,用于分步展示内容。
|
|
</Card>
|
|
|
|
<Card title="可展开区域" icon="chevrons-down" href="/zh/components/expandables">
|
|
按需显示和隐藏详细内容。
|
|
</Card>
|
|
|
|
<Card title="视图" icon="eye" href="/zh/components/view">
|
|
根据上下文有条件地显示内容。
|
|
</Card>
|
|
|
|
<div id="document-your-api">
|
|
## 为 API 编写文档
|
|
</div>
|
|
|
|
<Card title="字段" icon="text-cursor-input" href="/zh/components/fields">
|
|
展示参数和属性的定义。
|
|
</Card>
|
|
|
|
<Card title="响应" icon="arrow-left-right" href="/zh/components/responses">
|
|
记录 API 响应的结构和字段。
|
|
</Card>
|
|
|
|
<Card title="示例" icon="file-code" href="/zh/components/examples">
|
|
将请求和响应示例并排展示。
|
|
</Card>
|
|
|
|
<div id="link-to-other-pages">
|
|
## 链接到其他页面
|
|
</div>
|
|
|
|
<Card title="卡片" icon="square" href="/zh/components/cards">
|
|
使用可自定义的容器和图标突出展示内容。
|
|
</Card>
|
|
|
|
<Card title="磁贴" icon="layout-grid" href="/zh/components/tiles">
|
|
以可点击的磁贴网格形式展示内容。
|
|
</Card>
|
|
|
|
<div id="add-visual-context">
|
|
## 添加视觉上下文
|
|
</div>
|
|
|
|
<Card title="图标" icon="smile" href="/zh/components/icons">
|
|
使用 Lucide 图标库添加视觉提示。
|
|
</Card>
|
|
|
|
<Card title="Mermaid 图表" icon="git-branch" href="/zh/components/mermaid-diagrams">
|
|
创建流程图、时序图等。
|
|
</Card>
|
|
|
|
<Card title="颜色" icon="palette" href="/zh/components/color">
|
|
展示带十六进制值的颜色样本。
|
|
</Card> |