9f99ae3ca7
* docs: add markdown-basic en * docs: add markdown-extensions en * docs: add markdown-icons en * docs: add markdown-mark en , change file structure * docs: update usage * docs: add to markdown-caniuse en * docs: add en docs markdown - import files * docs: add en docs markdown - collapse * chore: fix package lock file --------- Co-authored-by: pengzhanbo <volodymyr@foxmail.com>
1.5 KiB
1.5 KiB
title, createTime, icon, permalink, outline
| title | createTime | icon | permalink | outline |
|---|---|---|---|---|
| Demo Wrapper | 2025/03/24 21:49:01 | icon-park-outline:eyes | /en/guide/markdown/demo-wrapper/ | 2 |
Overview
Sometimes, you may need to add examples in your content but want them to be presented separately from other content. The theme supports adding demo wrapper in Markdown files.
Syntax
::: demo-wrapper
Add your example here
:::
Options
title="xxx": Titleno-padding: No paddingimg: Use when only containing an imageheight="xxx": Height
Example
Image only:
::: demo-wrapper img no-padding
:::
Output:
::: demo-wrapper img no-padding
:::
Markdown content:
::: demo-wrapper title="Title"
### Third-level heading
This is the content within the demo wrapper.
:::
Output: ::: demo-wrapper title="Title"
Third-level heading
This is the content within the demo wrapper. :::
HTML/Vue code:
::: demo-wrapper
<h1 class="your-demo-title">This is a heading</h1>
<p class="your-demo-paragraph">This is a paragraph</p>
<style>
.your-demo-title {
color: red;
}
.your-demo-paragraph {
color: blue;
}
</style>
:::
Output: ::: demo-wrapper
This is a title
This is a paragraph
:::