Markdown 语法支持

仅以此篇文章来测试下在 NexT 主题中在通过 Hugo 引擎来建站时,是否支持 Markdown 文件内容中所写的各种语法,并展示下实际的效果。

标题样式

让我们从所有可能的标题开始,在 HTML 中 <h1>-<h6>元素分别表示六个不同级别的标题样式,其中 <h1> 为最大标题,<h6>为最小标题,效果如下:

标题 1

标题 2

标题 3

标题 4

标题 5
标题 6

段落格式

根据 W3C 定义的 HTML5 规范 ,HTML 文档由元素和文本组成。每个元素的组成都由一个 开始标记 表示,例如: <body> ,和 结束标记 表示,例如: </body> 。(某些开始标记和结束标记在某些情况下可以省略,并由其他标记暗示。) 元素可以具有属性,这些属性控制元素的工作方式。例如:超链接是使用 a 元素及其 href 属性形成的。

Markdown 语法

![图像说明](图像地址)

hugo-next-primary

HTML IMG 标签

<img src="图像地址" width="宽度" height="高度" />

SVG 格式

<svg>xxxxxx</svg>

列表类型

有序列表

  1. 第一个元素
  2. 第二个元素
  3. 第三个元素

无序列表

  • 列表元素
  • 另一个元素
  • 和其它元素

嵌套列表

借助 HTML 的 ul 元素来实现。

  • 第一项
  • 第二项
    • 第二项第一个子项目
    • 第二项第二个子项目
      • 第二项第二分项第一分项
      • 第二项第二分项第二分项
      • 第二项第二分项第三分项
    • 第二项第三个子项目
      1. 第二项第三分项第一分项
      2. 第二项第三分项第二分项
      3. 第二项第三分项第三分项
  • 第三项

自定义列表

通过 HTML 的 dl 元素还支持自定义列表(表格列表)。

Hugo 目录结构
assets
config.toml
content
data
theme
static
Hugo 模板
基础模板
列表模板
单页模板

块引用

blockquote 元素表示从另一个源引用的内容,可以选择引用必须在 footer 或 cite 元素中,也可以选择使用注释和缩写等行内更改。

引用文本 这一行也是同样的引用 同样你也在 blockquote 中使用 Markdown 语法书写

带有引文的 Blockquote 元素效果。

我的目标不是赚大钱,是为了制造好的电脑。当我意识到我可以永远当工程师时,我才创办了这家公司。

— 史蒂夫·沃兹尼亚克

根据 Mozilla 的网站记录,Firefox 1.0 于 2004 年发布,并取得了巨大成功。

表格

表格并不算是 Markdown 的核心要素,但 Hugo 同样支持它。

ID创建者模型年份
1HondaAccord2009
2ToyotaCamry2012
3HyundaiElantra2010

可以使用 : (英文格式冒号)来对表格内容进行对齐。

表格可以是很酷
左对齐居中右对齐
左对齐居中右对齐
左对齐居中右对齐

同样也可以在表格中使用 Markdown 语法。

表格中使用Markdown 语法
斜体粗体中划线代码块

Code

<!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>

其它元素: abbr、sub、sup、kbd等等

GIF 是位图图像格式。

H2O

C6H12O6

Xn + Yn = Zn

按X获胜。或按CTRL+ALT+F显示 FPS 计数器。

比特作为信息论中的信息单位,也被称为 shannon ,以信息论领域的创始人 Claude shannon 的名字命名。

参考: