容器
容器是特殊的标注框,用于突出显示重要信息。
基本语法
::: type
内容放在这里
:::
容器类型
提示 (Tip)
用于有用的建议:
::: tip
这是给读者的一个有用提示。
:::
Tip
这是给读者的一个有用提示。
信息 (Info)
用于补充说明:
::: info
这里是一些额外的信息。
:::
Info
这里是一些额外的信息。
警告 (Warning)
用于需要注意的事项:
::: warning
请小心这个操作。
:::
Warning
请小心这个操作。
危险 (Danger)
用于严重警告:
::: danger
此操作无法撤销!
:::
Danger
此操作无法撤销!
备注 (Note)
用于一般性说明:
::: note
给读者的一个旁注。
:::
Note
给读者的一个旁注。
自定义标题
在类型后添加自定义标题:
::: tip 专业建议
这个容器有一个自定义标题。
:::
专业建议
这个容器有一个自定义标题。
::: warning 安全提醒
始终验证用户输入!
:::
安全提醒
始终验证用户输入!
丰富内容
容器内支持完整的 Markdown:
::: info 功能特性
这个博客支持:
- **Markdown** 格式
- `代码` 片段
- [链接](https://example.com)
:::
功能特性
这个博客支持:
- Markdown 格式
代码片段- 链接
折叠面板 (Details)
创建可展开的区域:
::: details 点击展开
这些内容默认是隐藏的。
你可以在这里放很多内容。
:::
点击展开
这些内容默认是隐藏的。
你可以在这里放很多内容。
折叠面板中的代码
::: details 查看解决方案
function solve() {
return 42;
}
:::
查看解决方案
function solve() {
return 42;
}
最佳实践
何时使用容器
- tip - 有用的建议、最佳实践
- info - 背景信息、上下文
- warning - 潜在问题、需要注意的事项
- danger - 严重错误、数据丢失风险
- note - 一般性说明
- details - 可选内容、长示例
不要过度使用
太多容器会分散注意力。谨慎使用,只用于真正重要的信息。
快速参考
| 类型 | 语法 | 用途 |
|---|---|---|
| tip | tip | 有用的建议 |
| info | info | 额外信息 |
| warning | warning | 注意事项 |
| danger | danger | 严重警告 |
| note | note | 旁注 |
| details | details | 可折叠内容 |
下一步:掌握 代码块 来展示精美的代码片段。