短代码示例
这是一个示例帖子,旨在测试以下内容:
- 默认的主图(Hero Image)。
- 不同的短代码(Shortcodes)。
提示框 (Alert)
本主题支持以下几种提示框。
type="success" 的例子type="danger" 的例子type="warning" 的例子type="info" 的例子type="dark" 的例子type="primary" 的例子type="secondary" 的例子图片 (Image)
不带任何属性的示例图片。

带有 height(高度)和 width(宽度)属性的示例图片。

带有 height 和 width 属性的居中对齐图片。

带有 float(浮动)属性的图片。

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras egestas lectus sed leo ultricies ultricies. Praesent tellus risus, eleifend vel efficitur ac, venenatis sit amet sem. Ut ut egestas erat. Fusce ut leo turpis. Morbi consectetur sed lacus vitae vehicula. Cras gravida turpis id eleifend volutpat. Suspendisse nec ipsum eu erat finibus dictum. Morbi volutpat nulla purus, vel maximus ex molestie id. Nullam posuere est urna, at fringilla eros venenatis quis.
Fusce vulputate dolor augue, ut porta sapien fringilla nec. Vivamus commodo erat felis, a sodales lectus finibus nec. In a pulvinar orci. Maecenas suscipit eget lorem non pretium. Nulla aliquam a augue nec blandit. Curabitur ac urna iaculis, ornare ligula nec, placerat nulla. Maecenas aliquam nisi vitae tempus vulputate.
分栏 (Split)
本主题支持将页面拆分为任意数量的列。
两栏分割
左栏
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras egestas lectus sed leo ultricies ultricies.
右栏
Fusce ut leo turpis. Morbi consectetur sed lacus vitae vehicula. Cras gravida turpis id eleifend volutpat.
三栏分割
左栏
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras egestas lectus sed leo ultricies ultricies.
中栏
Aenean dignissim dictum ex. Donec a nunc vel nibh placerat interdum.
右栏
Fusce ut leo turpis. Morbi consectetur sed lacus vitae vehicula. Cras gravida turpis id eleifend volutpat.
垂直间距 (Vertical Space)
在两行之间提供垂直间距。
这是第一行。
这是第二行。它与前一行之间应该有4rem 的垂直间距。视频 (Video)
视频来源:Rahul Sharma 选自 Pexels。
Mermaid 图表
这里有几个 Mermaid 短代码的示例。
流程图 (Graph):
时序图 (Sequence Diagram):
占据上风! John-->>Alice: 挺好的! John->>Bob: 你呢? Bob-->>John: 非常棒!
甘特图 (Gantt diagram):
