Markdown 语法测试

Posted on May 29, 2022
tl;dr: 重新搭建了博客,测试一下 markdown 的基本语法和样式。

前言

前前后后搭建博客也有很多次了,静态网站生成器用过 hexovuepresshugo,还是觉得 hugo 最好用:速度快、安装方便、跨平台、热更新,最重要的是使用起来比较简单。

之前使用 hugo 搭建博客,主题用过 even ,但感觉用的人太多了,用过时间比较久的是 loveit ,是个很不错的主题,中文文档也很全,使用起来很方便,但是现在我想要更简洁一点的主题,王垠 的博客主题我就觉得很不错,还有偶然间发现的无求备斋笔记 ,本来这次搭建博客是想用 无求备斋笔记 的样式,可是这个主题是基于 jekyll 的,我尝试用了用 jekyll ,感觉不太好用,不如 hugo,等以后有时间研究下怎么写主题,然后把它转换成 hugo 的模板吧,现在懒得折腾。在 github 上找了两个比较喜欢的主题:FujiArchie,最终我选择了Archie,因为它看起来更简洁一些。

1 基本语法

1.1 标题

# 一级标题
## 二级标题
### 三级标题
#### 四级标题
...

1.2 段落

空白行将一行或多行文本进行分隔。

这是第一段。

这是第二段。

这是第一段。

这是第二段。

1.3 换行

第一行,</br>
第二行

第一行,
仍是第一行。

第一行, 第二行

第一行, 仍是第一行。

1.4 强调

1.4.1 粗体

**这是粗体**

*这是斜体*

~~这是删除线~~

这是粗体

这是斜体

这是删除线

1.5 引用

> 这是引用
> 
>> 这是引用中的引用。
>
> 引用。

这是引用

这是引用中的引用。

引用。

1.6 列表

1. item1
2. item2
3. item3

- item1
- item2
- item3
  1. item1
  2. item2
  3. item3
  • item1
  • item2
  • item3

1.7 代码

行内代码:`if a == b` 。

转义反引号:

``Use `code` in your Markdown file.``

围栏代码块:

\```c
#include <stdio.h>

int main(int argc, const char *argv[]) {
    printf("Hello,world!");

    return 0;
}

\```

if a == b

Use `code` in your Markdown file.

#include <stdio.h>

int main(int argc, const char *argv[]) {
    printf("Hello,world!");

    return 0;
}

1.8 分割线

这是分割线:

---

为了兼容性,请在分隔线的前后均添加空白行。

这是分割线:


为了兼容性,请在分隔线的前后均添加空白行。

1.9 链接

[Google](https://www.google.com)
给链接增加 title:
[Google](https://www.google.com "google !")
引用类型链接:
[Google][1]

[1]: https://www.google.com

Google

Google

Google

1.10 图片

![这是图片](/assets/img/philly-magic-garden.jpg "Magic Gardens")
给图片添加链接:
[![沙漠中的岩石图片](/assets/img/shiprock.jpg "Shiprock")](https://markdown.com.cn)

哪吒

1.11 转义字符

要显示原本用于格式化 Markdown 文档的字符,请在字符前面添加反斜杠字符 \

1.12 内嵌 HTML 标签

对于 Markdown 涵盖范围之外的标签,都可以直接在文件里面用 HTML 本身。如需使用 HTML,不需要额外标注这是 HTML 或是 Markdown,只需 HTML 标签添加到 Markdown 文本中即可。

2 扩展语法

2.1 表格

要添加表,请使用三个或多个连字符(—)创建每列的标题,并使用管道(|)分隔每列。

| 姓名 | 性别 | 学校 |
| --- | --- | --- |
| 张三 | 男 | 五道口职业技术学院 |
| 李红 | 女 | 北雷村职业技术学院 |

对齐:

| 姓名 | 性别 | 学校 |
| :---: | :--- | ---: |
| 张三 | 男 | 五道口职业技术学院 |
| 李红 | 女 | 北雷村职业技术学院 |
姓名 性别 学校
张三 五道口职业技术学院
李红 北雷村职业技术学院

对齐:

姓名 性别 学校
张三 五道口职业技术学院
李红 北雷村职业技术学院

2.2 脚注


什么是五道口职业技术学院[^1]?

北雷村职业技术学院[^2]在哪里?

[^1]: 清华大学
[^2]: 西安电子科技大学

什么是五道口职业技术学院1

北雷村职业技术学院2在哪里?

2.3 标题编号

在与标题相同的行上用大括号括起该自定义ID。
### 标题1 {#custom-id}
通过创建带有数字符号(#)和自定义标题ID的[标准链接]((/basic-syntax/links.html),可以链接到文件中具有自定义ID的标题。
[标题1](#custom-id)
可用于创建目录:
- [1 基本语法](#1-基本语法)
  - [1.1 标题](#11-标题)
  - [1.2 段落](#12-段落)
  - [1.3 换行](#13-换行)
  - [1.4 强调](#14-强调)
  - [1.5 引用](#15-引用)
  - [1.6 列表](#16-列表)
  - [1.7 代码](#17-代码)
  - [1.8 分割线](#18-分割线)
  - [1.9 链接](#19-链接)
  - [1.10 图片](#110-图片)
  - [1.11 转义字符](#111-转义字符)
  - [1.12 内嵌 HTML 标签](#112-内嵌-html-标签)
- [2 扩展语法](#2-扩展语法)
  - [2.1 表格](#21-表格)
  - [2.2 脚注](#22-脚注)
  - [2.3 标题编号](#23-标题编号)
  - [2.4 todo list](#24-todo-list)

2.4 todo list

  - [ ] todo1
  - [ ] todo2
  - [x] todo3
  • todo1
  • todo2
  • todo3

2.5 其他

其他支持:katex、front matter。

详见:

katex : https://github.com/waylonflinn/markdown-it-katex#syntax

front matter : https://github.com/waylonflinn/markdown-it-katex#syntax


留言或评论请使用 Github Issues


  1. 清华大学 ↩︎

  2. 西安电子科技大学 ↩︎