Markdown语法

109 阅读2分钟

简介

Markd是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档。Markdown编写的文档可以导出HTML、Word、PDF等众多格式的文档。

基础功能

标题

Markdown的标题有两种格式

  1. 使用 =- 标记一级和二级标题 用法如下:
一级标题
=======
二级标题
-------

效果如下:

img-20220514141121.png 2. 使用 # 标记 使用对应数量的#标注1-6级标题,一级对应一个#,一次类推 使用方法如下:

# 一级标题
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题

效果如下:

img-20220514141402.png

段落样式

  • 换行 Markdown段落没有特殊的格式,直接编写文本就好,段落换行使用两个连续的空格加上回车符
  • 字体 使用方法如下:
*斜体文本*
_斜体文本_
**粗体文本**
__粗体文本__
***粗斜体文本***
___粗斜体文本___

效果如下:

img-20220514141737.png

  • 分割线 可以在一行中使用*-_来建立一个分割线,行内不能有其他东西,可以在符号之中加入空格 使用方法如下:
***
​
* * *
​
*****
​
- - -----------
​
___
​
_ _ _

效果如下:

img-20220514142052.png

删除线

通过在文本两端添加波浪线实现 使用方法如下:

Hello
~~Hello~~

效果如下:

img-20220514142220.png

下划线

可以通过html的实现 使用方法如下:

<u>下划线文本<u>

效果如下:

img-20220514142338.png

脚注

脚注主要用于对内容的补充说明,使用格式如下

[^需要说明的对象]:说明的内容

使用方法:

其他文本[^说明的对象]
[^说明的对象]:说明的内容

效果如下:

img-20220514142907.png

无序列表

使用方法:

* 第一项
* 第二项
* 第三项
​
+ 第一项
+ 第二项
+ 第三项
​
​
- 第一项
- 第二项
- 第三项

效果图:

img-20220514143001.png

有序列表

使用方法:

1. 第一项
2. 第二项
3. 第三项

效果图:

img-20220514143058.png

列表嵌套

在需要嵌套的列表前额外增加四个空格即可 示例:

1. 第一项:
    - 第一项嵌套的第一个元素
    - 第一项嵌套的第二个元素
2. 第二项:
    - 第二项嵌套的第一个元素
    - 第二项嵌套的第二个元素

效果:

img-20220514143221.png

区块

使用>标记区块 示例:

> 区块引用
> 学的不仅是技术更是梦想

效果:

img-20220514143323.png

区块嵌套

示例:

> 最外层
> > 第一层嵌套
> > > 第二层嵌套

效果:

img-20220514143459.png

区块中使用列表

示例:

> 区块中使用列表
> 1. 第一项
> 2. 第二项
> + 第一项
> + 第二项
> + 第三项

效果:

img-20220514143529.png

列表中使用区块

示例:

* 第一项
    > 菜鸟教程
    > 学的不仅是技术更是梦想
* 第二项

效果:

img-20220514143601.png

代码

使用反引号`包裹 示例:

`printf()` 函数

效果:

img-20220514144205.png

代码块

使用连续三个反引号```包裹, 也可以使用连续四个空格或者一个Tab 示例:

    ```javascript
        $(document).ready(function () {
        alert('Hello');
        });

效果:

img-20220514144544.png

链接

使用方法


[链接名称](%E9%93%BE%E6%8E%A5%E5%9C%B0%E5%9D%80)

或者

<链接地址>

示例:


百度连接[这里][hhttps://www.baidu.com]()

[hhttps://www.baidu.com]()

效果:

img-20220514144757.png

高级链接

可以使用一个变量来设置链接,变量的赋值放在文章末尾 例如:


这个链接用 1 作为网址变量 [Google](#) 这个链接用 runoob 作为网址变量 [百度](#) 然后在文档的结尾为变量赋值(网址)

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

[baidu]  https://www.baidu.com/ 

效果:

img-20220514145054.png

图片

图片的描述格式如下

此外还可以使用<img>标签 示例:


![RUNOOB 图标](https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/1553f0cc12f3442581cd8d2f98981a15~tplv-k3u1fbpfcp-zoom-1.image)

![RUNOOB 图标](https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/5130a12a865c4c45b969c9dfc9dc72aa~tplv-k3u1fbpfcp-zoom-1.image "RUNOOB")

效果:

img-20220514145312.png

表格

格式如下:


| 表头  | 表头  |
| --- | --- |
| 单元格 | 单元格 |
| 单元格 | 单元格 |

效果如下:

img-20220514145632.png 对齐方式设置:


-: 设置内容和标题栏居右对齐。 :- 设置内容和标题栏居左对齐。 :-: 设置内容和标题栏居中对齐。

| 左对齐 | 右对齐 | 居中对齐 |
| --- | --- | ---- |
| 单元格 | 单元格 | 单元格  |
| 单元格 | 单元格 | 单元格  |

效果图:

img-20220514145805.png

待办事项

- [ ]开始,注意方括号中间有空格的为无对号的选择框(不可交互),- [x]为有对号的。

- [x] 待办事项一
- [] 待办事项二

效果如下:

  • 待办事项一
  • 待办事项二 ​

高级技巧

HTML元素

例如:


使用 `Ctrl`+`Alt`+`Del` 重启电脑

效果:

img-20220514150612.png

转义

示例:


**文本加粗**
\*\* 正常显示星号 \*\*

效果:

img-20220514150701.png

公式

格式: $...$ 或者 (...) 中的数学表达式将会在行内显示。 $$...$$ 或者 [...] 或者 ```math 中的数学表达式将会在块内显示。 示例:

$$
\begin{Bmatrix}
   a & b \
   c & d
\end{Bmatrix}
$$
$$
\begin{CD}
   A @>a>> B \
@VbVV @AAcA \
   C @= D
\end{CD}
$$

效果: img-20220514150902.png ​ ​

参考

菜鸟教程