Markdown Test

发表于： 分类于：
字数：1052 阅读：≈ 3分钟 浏览：

仅以此篇文章来测试下在 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 创建者 模型 年份
1 Honda Accord 2009
2 Toyota Camry 2012
3 Hyundai Elantra 2010

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

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

同样也可以在表格中使用 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 的名字命名。

参考：