文本与排版演示
展示文本、排版、数学公式、图表、流程图、图片、视频等多种渲染效果。
标题示例
H1 — heading
H2 — heading
H3 — heading
H4 — heading
段落
Quisque egestas convallis ipsum, ut sollicitudin risus tincidunt a. Maecenas interdum malesuada egestas. Duis consectetur porta risus, sit amet vulputate urna facilisis ac. Phasellus semper dui non purus ultrices sodales. Aliquam ante lorem, ornare a feugiat ac, finibus nec mauris. Vivamus ut tristique nisi. Sed vel leo vulputate, efficitur risus non, posuere mi. Nullam tincidunt bibendum rutrum. Proin commodo ornare sapien. Vivamus interdum diam sed sapien blandit, sit amet aliquam risus mattis. Nullam arcu turpis, mollis quis laoreet at, placerat id nibh. Suspendisse venenatis eros eros.
这一段保留原始拉丁文伪文本，用于展示字体和段落的排版效果。
列表
有序列表
- Firstly
- Secondly
- Thirdly
无序列表
- Chapter
- Section
- Paragraph
- Section
待办列表
- Job
- Step 1
- Step 2
- Step 3
说明列表
- Sun
- the star around which the earth orbits
- Moon
- the natural satellite of the earth, visible by reflected light from the sun
引用
这一行展示了 块级引用 的样式。
提示块
这是
tip类型提示的示例。
这是
info类型提示的示例。
这是
warning类型提示的示例。
这是
danger类型提示的示例。
表格
| Company | Contact | Country |
|---|---|---|
| Alfreds Futterkiste | Maria Anders | Germany |
| Island Trading | Helen Bennett | UK |
| Magazzini Alimentari Riuniti | Giovanni Rovelli | Italy |
链接
脚注
行内代码
下面演示 Inline Code 的显示效果。
文件路径
示例：/path/to/the/file.extend。
代码块
普通代码块
1
This is a common code snippet, without syntax highlight and line number.
指定语言
1
2
3
4
if [ $? -ne 0 ]; then
echo "The command was not successful.";
#do the needful / exit
fi;
指定文件名
1
2
3
@import
"colors/light-typography",
"colors/dark-typography";
数学公式
下方由 MathJax 渲染：
\[\begin{equation} \sum_{n=1}^\infty 1/n^2 = \frac{\pi^2}{6} \label{eq:series} \end{equation}\]可通过 \eqref{eq:series} 引用该公式。
当 $a \ne 0$ 时，二次方程 $ax^2 + bx + c = 0$ 的解为：
\[x = {-b \pm \sqrt{b^2-4ac} \over 2a}\]Mermaid 图
gantt
title Adding GANTT diagram functionality to mermaid
apple :a, 2017-07-20, 1w
banana :crit, b, 2017-07-23, 1d
cherry :active, c, after b a, 1d
图片
默认（带说明文字）
占满屏幕宽度并居中对齐
左对齐
浮动在左侧
Praesent maximus aliquam sapien. Sed vel neque in dolor pulvinar auctor. Maecenas pharetra, sem sit amet interdum posuere, tellus lacus eleifend magna, ac lobortis felis ipsum id sapien. Proin ornare rutrum metus, ac convallis diam volutpat sit amet. Phasellus volutpat, elit sit amet tincidunt mollis, felis mi scelerisque mauris, ut facilisis leo magna accumsan sapien. In rutrum vehicula nisl eget tempor. Nullam maximus ullamcorper libero non maximus. Integer ultricies velit id convallis varius. Praesent eu nisl eu urna finibus ultrices id nec ex. Mauris ac mattis quam. Fusce aliquam est nec sapien bibendum, vitae malesuada ligula condimentum.
浮动在右侧
Praesent maximus aliquam sapien. Sed vel neque in dolor pulvinar auctor. Maecenas pharetra, sem sit amet interdum posuere, tellus lacus eleifend magna, ac lobortis felis ipsum id sapien. Proin ornare rutrum metus, ac convallis diam volutpat sit amet. Phasellus volutpat, elit sit amet tincidunt mollis, felis mi scelerisque mauris, ut facilisis leo magna accumsan sapien. In rutrum vehicula nisl eget tempor. Nullam maximus ullamcorper libero non maximus. Integer ultricies velit id convallis varius. Praesent eu nisl eu urna finibus ultrices id nec ex. Mauris ac mattis quam. Fusce aliquam est nec sapien bibendum, vitae malesuada ligula condimentum.
深浅色模式与阴影
下方图片会根据主题偏好自动切换深浅色，同时带有阴影。
