Markdown语法讲解(上)——基本语法

Markdown语法讲解(上)——基本语法

********* 本文参考了

Markdown语法图文全面详解(10分钟学会)
B站up: "救救-99" 的Markdown保姆级教程视频

须知:此文章是个人的随手笔记,不是专业教程,仅供各位小伙伴参考

TOC

1 分级标题

一级标题的markdown语法规则为:

# 一级标题内容

注意:#与标题内容之间有一个“空格”;

二级标题的markdown语法规则为:

## 二级标题内容`

三级标题的Makedown语法规则为:

## 二级标题内容

以此类推……


2 设置<字体、字号与字体颜色>

2.1 字体

给文字设置字体的markdown语法规则为:

文字内容

例如在markdown编辑器中编写下面代码:

消灭恐惧的最好办法就是面对恐惧,加油,奥利给!

显示效果:

消灭恐惧的最好办法就是面对恐惧,加油,奥利给!

2.2 字号

给文字设置字号的markdown语法规则为:

文字内容

例如在markdown编辑器中编写下面代码:

消灭恐惧的最好办法就是面对恐惧,加油,奥利给

显示效果:

目前暂不支持该语法,此处内容无法显示!

2.3 字体颜色设置

颜色是按照24位的十六进制RGB信息确定的,例如红色的24位的十六进制RGB信息为:

#FF0000

给文字设置字体颜色的markdown语法规则为:

文字内容

例如在markdown编辑器中编写下面代码:

加油,奥利给!

显示效果:

加油,奥利给!

2.4 设置背景颜色

对应语法:

文字背景颜色

例如(同时我还把文字设置成白色):

文字背景颜色

显示效果:

无法显示

2.5字体、字号和字体颜色效果合并

给文字设置字体、字号和字体颜色的markdown语法规则为:

文字内容

例如在markdown编辑器中编写下面代码:

加油,奥利给!

HTML显示效果:

加油,奥利给!


3 设置<斜体、粗体、删除线、下标与上标>

3.1 斜体

字体设置斜体的markdown语法规则为:

*文字内容*

或者

_文字内容_

例如在markdown编辑器中编写下面代码:

*Thank you!*

HTML显示效果:

Thank you!

3.2 粗体

字体设置粗体的markdown语法规则为:

**文字内容**

例如在markdown编辑器中编写下面代码:

**Thank you!**

HTML显示效果:

Thank you!

3.3 删除线

设置删除线的markdown语法规则为:

~~文字内容~~

例如在markdown编辑器中编写下面代码:

~~Thank you!~~

显示效果:

Thank you!

这些效果可以叠加使用,比如在markdown编辑器中编写下面代码:

~~***Thank you!***~~

HTML显示效果:

Thank you!

3.4 下标

在下标内容两侧插入波浪线~

例如:

H~2~O

显示效果:

H2O


3.5 上标

在下标内容两侧插入上标符号^

例如:

a^2^+b^2^=1

显示效果:

a2+b2=1


4 插入<图片>

4.1 插入本地图片

插入本地图片的markdown语法规则:

![图片描述](图片路径)

可以采用相对路径或者绝对路径,如果图片放在本文档的文件夹下,可以采用相对路径,否则采用绝对路径。

  • 利用相对路径插入图片,例如在markdown编辑器中输入下面代码:
![《云之彼端,约定的地方》](云之彼端约定的地方3.jpg)
  • HTML显示效果:
云之彼端约定的地方3.jpg
  • 利用绝对路径插入图片,例如在markdown编辑器中输入下面代码:
![《云之彼端,约定的地方》](G:\101-Pictures\截屏图片\云之彼端约定的地方\云之彼端约定的地方2.jpg)
  • HTML显示效果:
云之彼端约定的地方2.jpg

注意:对于想要在hexo博客中插入图片,如果上传的.md文件直接用这里的插入图片的Markdown语法规则将会导致显示失败,也即是说这里的插入本地图片语法不能用在需要上传到hexo博客的.md文件中。

在hexo博客的文章中插入本地图片对应的语法规则为:

{% asset_img 图片路径.jpg 图片描述%}

例如:

{% asset_img 云之彼端约定的地方3.jpg 《云之彼端,约定的地方》%}

其中,图片路径是你要上传的.md文件的相对路径,该图片存放在一个与这个.md文件同名的的文件夹下。

在此之前,还需要安装相关的上传本地图片的插件hexo-asset-image才能实现在hexo博客文章中插入本地图片的功能。

在你的博客文件夹下,运行cmd或者git bash,输入下面代码来安装hexo-asset-image插件:


npm install hexo-asset-image --save

4.2 插入网络图片

插入网络图片的markdown语法规则:

![图片描述](网络图片路径)

例如在markdown编辑器中输入下面代码:


![言叶之庭](https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=3696447164,3237893343&fm=15&gp=0.jpg)

HTML显示效果:

言叶之庭

4.3 Typora插入图片

打开Typora软件,点击菜单栏的文件,然后依次点击偏好设置 - 图像,选择复制图片到当前文件夹或者其他保存路径,并勾选下面的选项,如下图所示:

Typora插入图片.png

Typora 的图片插入功能是广受好评的。要知道,Markdown 原生不太注重图片插入的功能,但你可以在 Typora 中:拖动图片到文档中,Typora 会自动帮你插入符合 Markdown 语法的图片语句,并给它加上标题。

Typora软件具有插入<图片、代码块、表格等>等选项,软件会自动添加相应的代码,大大方便了用户的使用


5 跳转

5.1 外部跳转——超链接

外部跳转格式为:

[外部跳转链接内容描述](链接地址)

例如在markdown编辑器中输入下面内容:

[Markdown语法图文全面详解(10分钟学会)](https://blog.csdn.net/u014061630/article/details/81359144)

HTML显示效果:

Markdown语法图文全面详解(10分钟学会)

5.2 内部跳转——文件内跳转

内部跳转格式为:

[跳转内容描述](#要跳转的标题)

例如在markdown编辑器中输入下面内容:

[跳转顶部](#Makedown语法讲解(上)——基本语法)

6 添加<自动链接>

Markdown 支持以比较简短的自动链接形式来处理网址和电子邮件信箱,只要是用<>包起来, Markdown 就会自动把它转成链接。也可以直接写,同样可以显示成链接形式。

例如:


或

https://lijinlong1997.github.io/

<[email protected]>

或

[email protected]

显示效果:

https://lijinlong1997.github.io/

[email protected]


7 插入<代码块>

7.1 行内代码

如果在一个行内需要引用代码,只要用反引号`引起来就好(一般在ESC键下方,和~同一个键)

例如输入:

`assign c = a + b;`

显示效果

assign c = a + b;

7.2 多行代码

多行代码块与语法高亮:在需要高亮的代码块的前一行及后一行使用三个单反引号“`”包裹,就可以了,还可以在第一个单反双引号后输入相应的语言。

例如输入:

```verilog

always@(posedge Clk or negedge Rst_n)

if(!Rst_n)

  c <= 1'b0;

else

  c <= a + b;

​```

显示效果:

always@(posedge Clk or negedge Rst_n)

if(!Rst_n)

  c <= 1'b0;

else

  c <= a + b;

8 插入<表格>

表格的基本写法简单,和表格的形状相似:

例如输入:

| xxx | xxx | xxx |

| --- | --- | --- |

| xxx | xxx | xxx |

| xxx | xxx | xxx |

显示效果:

目前暂不支持该语法,此处内容无法显示

xxx表示要输入的内容,其中竖线|不用严格对齐,对其与否,不影响最后的显示。

可以利用冒号:设置单元格内容的对齐方式,冒号在左边表示左对齐,右边表示有对齐,两边都有表示居中。

例如输入:

| xxx  | xxx  | xxx  |

| :--- | :--- | :--- |

| xxx  | xxx  | xxx  |

| xxx  | xxx  | xxx  |

显示效果:

目前暂不支持该语法,此处内容无法显示

在Tpyora等Markdown编辑器中有插入表格选项,直接插入表格后,软件会自动添加相应的表格代码到源代码中去,而不需要输入这些繁琐的标记内容。


9 添加<列表>

9.1 无序列表

使用 *,+,- 表示无序列表,注意:符号后面一定要有一个空格,起到缩进的作用。

例如:

* 列表内容1

* 列表内容2

* ……

显示效果:

  • 列表内容1

  • 列表内容2

  • ……

9.2 有序列表

使用数字和一个英文句点表示有序列表, 注意:英文句点后面一定要有一个空格,起到缩进的作用。

例如:

1. 内容1

2. 内容2

3. ……

显示效果

  1. 内容1

  2. 内容2

注意事项 :

在使用列表时,只要是数字后面加上英文的点,就会无意间产生列表,比如2020.04.25这时候想表达的是日期,有些软件把它被误认为是列表。解决方式:在每个点前面加上\就可以了。

比如:

2020\.04\.25

显示效果:

2020.04.25

还有,比如你就是想打**Thank you**,直接输入**Thank you**是不行的,因为根据Markdown语法会转换成粗体,这时候我们就可以多输入一个转义字符\,来表达\后的内容就是你想表达的就行了,即:

\*\*Thank you**

显示效果:

**Thank you**


10 添加分割线

在一行中用三个以上的星号(*)、减号(-)、底线(_)来建立一个分隔线,行内不能有其他东西。

格式为:

---

***

___

11 引用

在被引用的文本前加上>符号,以及一个空格就可以了,如果只输入了一个>符号会产生一个空白的引用。

例如:

> 文字内容

显示效果:

引用内容

除基本的引用外,还有嵌套引用等


12 其他操作

12.1 创建目录

在段落中输入[TOC]即可在本位置创建目录。

例如:

[TOC]

12.2 添加脚注

脚注就是在需要添加脚注的文字的后面加上脚注名字。

语法:

文字[^脚注名字]

例如:

IC[1]FPGA[2]

然后在文中(一般在页尾或者文章末尾)添加对应的脚注内容

12.3 添加emoji表情

输入英文冒号`:`后输入你想表达的内容的单词,这个功能不是很方便,需要自己记住你想用的表情的单词,而且有些平台不支持。

例如:

:cow

显示结果:

无法显示

下一篇:Markdown语法讲解(下)——高级语法


  1. Integrated circuit 集成电路 ↩

  2. Field Programmable Gate Array 现场可编程门阵列 ↩

你可能感兴趣的:(Markdown语法讲解(上)——基本语法)