跳转至

Markdown 语法

通用 Markdown / GFM 语法示例速查。本站专属写法(内容标签页、提示框、[TOC] 等)见 MkDocs 使用说明

🖼️ 引用外站图片防盗链

referrerpolicy · no-referrer · sub 正则替换。给外站图片加防盗链绕过属性。

引用其他网站的图片时可能加了防盗链,可以在 img 标签中添加下列元素:

referrerpolicy="no-referrer"

下方是正则替换规则:

arctl = sub("<(img.*?)>", r'<\1 referrerpolicy="no-referrer">\n\n', arctl)

🔠 标题

语法 说明
# 一级标题 一级标题
## 二级标题 二级标题
### 三级标题 三级标题
#### 四级标题 四级标题
##### 五级标题 五级标题
###### 六级标题 六级标题

➖ 横线

*** · --- · ___。三种分隔线写法。

***---___ 都可以显示横线效果:

语法 说明
*** 分隔线
--- 分隔线
___ 分隔线

✍️ 文本

普通文本

这是一段普通的文本。

单行文本

在一行开头加入 1 个 Tab 或者 4 个空格,即成为单行文本:

    Hello,大家好,我是果冻虾仁。

文本块

  • 语法 1:在连续几行的文本开头加入 1 个 Tab 或者 4 个空格。
  • 语法 2:使用一对各三个的反引号,效果如下:
欢迎到访
我是C++码农
你可以在知乎、CSDN、简书搜索【果冻虾仁】找到我

该语法也可以实现代码高亮,见下文「代码高亮」。

文字高亮

文字高亮功能能使行内部分文字高亮,使用一对反引号:

`linux` `网络编程` `socket` `epoll`

效果:linux 网络编程 socket epoll,也适合做一篇文章的 tag。

换行

直接回车不能换行。可以在上一行文本后面补两个空格,这样下一行的文本就换行了;或者在两行文本之间加一个空行,也能实现换行效果,不过这个行间距有点大。

斜体、粗体、删除线

语法 效果
*斜体1* 斜体1
_斜体2_ 斜体2
**粗体1** 粗体1
__粗体2__ 粗体2
这是一个 ~~删除线~~ 这是一个 删除线
***斜粗体1*** 斜粗体1
___斜粗体2___ 斜粗体2
***~~斜粗体删除线1~~*** 斜粗体删除线1
~~***斜粗体删除线2***~~ 斜粗体删除线2

斜体、粗体、删除线可混合使用。

🖼️ 图片

![alt](URL title) · 相对路径 · raw 地址。图片引用格式。

基本格式:

![alt](URL title)

alttitle 即对应 HTML 中的 alt 和 title 属性(都可省略):

字段 含义
alt 图片显示失败时的替换文本
title 鼠标悬停在图片时的显示文本(注意这里要加引号)

URL 即图片的 url 地址。引用本仓库中的图片直接使用相对路径即可;引用其他 github 仓库中的图片要注意格式,即 仓库地址/raw/分支名/图片路径,如:

https://gitee.com/eox/HowToCook/blob/master/dishes/drink/%E9%87%91%E8%8F%B2%E5%A3%AB/gin-fizz.jpg
# 语法 效果
1 ![baidu](http://www.baidu.com/img/bdlogo.gif "百度logo") baidu

🔗 链接

链接外部 URL

# 语法 效果
1 [我的博客](https://img-home.csdnimg.cn/images/20201124032511.png "悬停显示") 我的博客
2 [我的知乎][zhihu] 引用式链接,需在文末用 [zhihu]: https://... 定义

锚点

每一个标题都是一个锚点,和 HTML 的锚点(#)类似:

语法 说明
[回到顶部](#top1) 指向文首锚点 #top1;本页未定义该锚点,仅作语法示例

注意,标题中的英文字母都被转化为小写字母

以前 GitHub 对中文支持的不好,所以中文标题不能正确识别为锚点,但是现在已经没问题啦!

☑️ 复选框列表

- [x] · - [ ]。任务清单。

语法:

- [x] 需求分析
- [x] 系统设计
- [x] 详细设计
- [ ] 编码
- [ ] 测试
- [ ] 交付

效果:

  • 需求分析
  • 系统设计
  • 详细设计
  • 编码
  • 测试
  • 交付

可以用这个功能来标注某个项目各项任务的完成情况。

Tip

在 GitHub 的 issue 中使用该语法,可以实时点击复选框来勾选或解除勾选,而无需修改 issue 原文。

💬 块引用

“端”(endian)的起源:以下是 Jonathan Swift 在 1726 年关于大小端之争历史的描述。

块引用有多级结构,语法:

> 数据结构
>> 树
>>> 二叉树
>>>> 平衡二叉树
>>>>> 满二叉树

效果:

数据结构

二叉树

平衡二叉树

满二叉树

💻 代码高亮

语言标记 · title= · 行内高亮。代码块与标题。

在三个反引号后面加上编程语言的名字,另起一行开始写代码,最后一行再加上三个反引号。效果:

public static void main(String[]args){} //Java
int main(int argc, char *argv[]) //C
echo "hello GitHub" #Bash
document.getElementById("myH1").innerHTML="Welcome to my Homepage"; //javascipt
string &operator+(const string& A,const string& B) //cpp

带标题的代码块

多文件或需要标明来源时,用 title= 显示标题:

bubble_sort.py
def bubble_sort(items):
    for i in range(len(items)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]

📊 表格对齐

表格可以指定对齐方式:

左对齐 居中 右对齐
col 3 is some wordy text $1600
col 2 is centered $12
zebra stripes are neat $1

对应的对齐标记:

标记 对齐
:--- 左对齐
:--: 居中
---: 右对齐

➕➖ diff 语法

diff 围栏 · +/-。展示新增与删除。

版本控制的系统中都少不了 diff 的功能,即展示一个文件内容的增加与删除。GFM 中可以展示 diff 效果,使用绿色表示新增,红色表示删除。

语法与代码高亮类似,只是在三个反引号后面写 diff,并且其内容中可以用 + 开头表示新增、- 开头表示删除,另外还有 !# 的语法。

效果:

+ 人闲桂花落,
- 夜静春山空。
! 月出惊山鸟,
# 时鸣春涧中。

🧱 常用 HTML 语法

Markdown 支持 HTML 语法。虽然不鼓励大量使用,但有些 HTML 语法在写 README 时是很有用的补充。

折叠与居中

把一个表格在页面中居中展示:

<div align="center" markdown="1">

| 表头1  | 表头2|
| ---------- | -----------|
| 表格单元   | 表格单元   |
| 表格单元   | 表格单元   |

</div>

其他任意需要居中展示的语法,都可以放在其中:

表头1 表头2
表格单元 表格单元
表格单元 表格单元

<details> 折叠块可放 HTML 与表格:

<details markdown="1">
<summary>Linux环境  details markdown="1" </summary>
<iframe
    frameborder="no"
    border="0"
    marginwidth="0"
    marginheight="0"
    width=330
    height=86
    src="//music.163.com/outchain/player?type=2&id=393697&auto=1&height=66">
</iframe>

| Syntax      | Description |
| ----------- | ----------- |
| Header      | [Title](https://www.baidu.com)       |
| Paragraph   | Text        |

</details>

markdown 属性取值(block 强行全部解析、1 默认解析、span 只解析内联不解析块级)以及用 [TOC] 生成折叠目录的写法,见 MkDocs 使用说明

文字居中:

<center>文字居中</center>

上标、下标、下划线

上标:O<sup>2</sup>
下标:H<sub>2</sub>O
<u>下划线 underline</u>

效果:上标 O2、下标 H2O、下划线 underline


✨ 本站增强语法

==高亮== · ++按键++ · :lucide-xxx: · ??? · 脚注 · 缩写。Zensical / pymdownx 提供的扩展写法现场演示。

写法 效果
==重点== 重点
^^插入^^ 插入
~~删除~~ 删除
H~2~O H2O
A^T^ AT
++Ctrl+C++ ++Ctrl+C++
`#!python range()` range()
:lucide-check:
点击展开的折叠块

折叠内容写在这里,注意缩进 4 个空格。

正文引用来源1,鼠标悬停即可预览脚注内容。

术语可用缩写定义:本站开启 pymdownx.snippets 自动追加术语表,也可在页内写 *[术语]: 全称 覆盖。

术语
定义列表适合「一项说明很长」的场景,比表格更省列宽。

  1. 这是脚注内容,会自动渲染到页面底部并带返回链接。