示例容器
259字小于1分钟
2024-09-30
概述
有时候,你可能需要在 内容中补充一些 示例,但期望能与 其它内容 分隔开来呈现。 主题支持在 Markdown 文件中添加示例容器。
语法
::: demo-wrapper
添加你的示例
:::
选项
title="xxx"
:标题no-padding
:不添加内边距img
: 仅包含图片时使用height="xxx"
: 高度
示例
仅包含图片:
::: demo-wrapper img no-padding
![hero](/images/custom-hero.png)
:::
输出:
包含 markdown 语法:
::: demo-wrapper title="标题"
### 三级标题
这是示例容器中的内容。
:::
输出:
标题
三级标题
这是示例容器中的内容。
包含 html /vue 代码:
::: demo-wrapper
<h1 class="your-demo-title">这是标题</h1>
<p class="your-demo-paragraph">这是段落</p>
<style>
.your-demo-title {
color: red;
}
.your-demo-paragraph {
color: blue;
}
</style>
:::
输出:
这是标题
这是段落