Markdown语法备忘录

这不是一篇教你如何入门 Markdown 语法的文章，它存在的目的是记录我们平常不经常使用的语法，例如如何调整图片的宽度信息；由于这些语法我们不经常使用，所以到用时总是会忘记，此时就需要一篇文章来记录这些不常用的语法，需要用到但又忘记的时候打开来看一下即可。

基于这个原则，文章不会有如何声明标题这样的语法。

注意：文章中用到了很多 HTML 语法，某些平台可能不支持这些语法。

多行段落

默认情况下多行空白内容只会显示一行；可以使用 <br></br> 实现多行效果。

xml 复制代码

第一行

<br></br>
<br></br>
第二行

第一行

第二行

单行注释

由于是注释内容，所以你看不到实际内容，这是正常现象(如果你看到了实际内容，说明该平台不支持该语法)。

markdown 复制代码

[//]: 这是一行注释

多行注释

xml 复制代码

<!--
我是第一行注释，
我是第二行注释。
-->

空格

默认情况下多个空格只会显示为一个空格，可以使用   实现多个空格的效果。

xml 复制代码

文字1 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;文字2

文字1 文字2

链接的悬停文案

less 复制代码

[百度](https://www.baidu.com "当鼠标悬停在文字上方时，你会看到它")

百度(ps: 把鼠标悬停在「百度」上，你能看到悬停文案)

图片的悬停文案

less 复制代码

![阿西河图片](https://p.upyun.com/docs/cloud/demo.jpg "当鼠标悬停在文字上方时，你会看到它")

图片自定义对齐方式和尺寸等参数

css 复制代码

<div style="text-align: center;background-color: #b6ffc8;">
    <img 
        src="https://p.upyun.com/docs/cloud/demo.jpg" 
        alt="阿西河图片" 
        title="阿西河图片Title" 
        style="width:300px;height:300px;"
    >
</div>

代码高亮

arduino 复制代码

```c
int main(int argc, const char * argv[]) {
    printf("Hello World!");
    return 0;
}
```

c 复制代码

int main(int argc, const char * argv[]) {
    printf("Hello World!");
    return 0;
}

大部分语言的关键字都是其名称的小写形式，例如 JavaScript 对应的关键字是 javascript，固而我只记录了一些特殊的关键字：

语言名	关键字
C++	cpp
c#	cs
Objective-C	objc

跳转到指定标题

ini 复制代码

[点击跳转到「多行段落」标题](#多行段落)

点击跳转到「多行段落」标题

跳转到指定文案

要跳转处的文案必须这样写：<span id="anchor1">默认情况下</span>。

ini 复制代码

[点击跳转到指定位置「默认情况下」](#anchor1)

点击跳转到指定位置「默认情况下」

脚注

css 复制代码

脚注1[^1]

脚注1 ^1^

任务列表

css 复制代码

- [x] 已完成的任务
- [ ] 未完成的任务

已完成的任务
未完成的任务

删除线

复制代码

这是 ~~删除线~~

这是 ~~删除线~~

字体

xml 复制代码

<font face="黑体" size=5>我是黑体字</font>
<font face="微软雅黑" size=5>我是微软雅黑</font>

我是黑体字

我是微软雅黑

文字颜色

css 复制代码

<font color=#0099ff>我的文字颜色是蓝色</font>

我的文字颜色是蓝色

上标

css 复制代码

n<sup>2</sup> = n * n

n² = n * n

下标

lua 复制代码

H<sub>2</sub>O

H₂O

背景颜色

css 复制代码

<p style="background-color: #b6ffc8;"><font color=#000>背景是绿色</font></p>

背景是绿色

文字对齐方式

css 复制代码

<p style="text-align: left;background-color: #b6ffc8;"><font color=#000>文字左对齐</font></p>
<p style="text-align: center;background-color: #b6ffc8;"><font color=#000>文字居中对齐</font></p>
<p style="text-align: right;background-color: #b6ffc8;"><font color=#000>文字右对齐</font></p>

文字左对齐

文字居中对齐

文字右对齐

插入音频

ini 复制代码

<iframe 
    frameborder="no" 
    border="0" 
    marginwidth="0" 
    marginheight="0" 
    width=100% 
    height=auto 
    src="https://music.163.com/outchain/player?type=2&id=528478901&auto=1&height=66">
</iframe>

插入视频

css 复制代码

<iframe 
    src="https://player.bilibili.com/player.html?aid=10631344&cid=17548810&page=1" 
    scrolling="no" 
    style="border:0;width:100%;height:auto;min-height:790px;"
    allowfullscreen="true"> 
</iframe>

使用Mermaid画图

rust 复制代码

```mermaid
sequenceDiagram
    participant Alice
    participant Bob
    Alice->John: Hello John, how are you?
    loop Healthcheck
        John->John: Fight against hypochondria
    end
    Note right of John: Rational thoughts <br/>prevail...
    John-->Alice: Great!
    John->Bob: How about you?
    Bob-->John: Jolly good!
```

sequenceDiagram participant Alice participant Bob Alice->John: Hello John, how are you? loop Healthcheck John->John: Fight against hypochondria end Note right of John: Rational thoughts
prevail... John-->Alice: Great! John->Bob: How about you? Bob-->John: Jolly good!

Footnotes

脚注1 ↩