目录
本文提供了可在 Hugo 内容文件中使用的基本 Markdown 语法示例,同时也展示了 Hugo 主题中 CSS 如何修饰基本的 HTML 元素。
标题
以下 HTML <h1>—<h6> 元素表示六个级别的部分标题。<h1> 是最高级别,而 <h6> 是最低级别。
三级标题
四级标题
五级标题
六级标题
段落
这是一个段落示例。在这里,我们可以看到文字是如何流动的。它包含了足够多的文字,以至于它可以换行,从而展示行间距和段落间距的效果。
另一个段落,用于展示段落之间的间距。在排版中,空白和文字一样重要。
引用块
引用块元素代表从其他来源引用的内容,可以选择带有来自于 footer 或 cite 元素的引用说明,并可选择带有行内修改,如注释和缩写。
无归属的引用块
这是一个没有任何特定归属的引用块示例。 注意 你可以在引用块中使用 Markdown 语法。
带归属的引用块
不要通过共享内存来通信,而要通过通信来共享内存。 — Rob Pike1
表格
表格不是 Markdown 核心规范的一部分,但 Hugo 原生支持它们。
| 姓名 | 年龄 |
|---|---|
| Bob | 27 |
| Alice | 23 |
表格内的行内 Markdown
| 斜体 | 粗体 | 代码 |
|---|---|---|
| 斜体 | 粗体 | code |
| A | B | C | D | E | F |
|---|---|---|---|---|---|
| 这是一个很长的单元格内容,主要用于测试表格在不同屏幕尺寸下的响应式表现。 | 这是另一列的内容,同样包含了大量的文字,以确保表格布局能够正确处理长文本。 | 第三列的内容也不短,看看它会如何影响周围的列宽分配以及整体的表格结构。 | 短文本测试 | 中等长度的文本测试,稍微长一点 | 最后的总结性文本,填满表格。 |
代码块
使用反引号的代码块
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Example HTML5 Document</title>
</head>
<body>
<p>Test</p>
</body>
</html>
缩进四个空格的代码块
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Example HTML5 Document</title>
</head>
<body>
<p>Test</p>
</body>
</html>
代码差异对比
[dependencies.bevy]
git = "https://github.com/bevyengine/bevy"
rev = "11f52b8c72fc3a568e8bb4a4cd1f3eb025ac2e13"
- features = ["dynamic"]
+ features = ["jpeg", "dynamic"]
单行代码块
<p>A paragraph</p>
列表类型
有序列表
- 第一项
- 第二项
- 第三项
无序列表
- 列表项
- 另一项
- 还有一项
嵌套列表
- 水果
- 苹果
- 橘子
- 香蕉
- 乳制品
- 牛奶
- 奶酪
其他元素 — abbr, sub, sup, kbd, mark
GIF 是一种位图图像格式。
H2O
Xn + Yn = Zn
按 CTRL + ALT + Delete 结束会话。
大多数 蝾螈 都是夜行性的,捕食昆虫、蠕虫和其他小生物。
