Markdown文档书写方法(工具+示例+验证)

最新推荐文章于 2024-04-17 09:53:25 发布

Bright Stone

最新推荐文章于 2024-04-17 09:53:25 发布

阅读量4.5k

点赞数 2

文章标签：开发工具 markdown python

本文链接：https://blog.csdn.net/hmllittlekoi/article/details/104414201

版权

Markdown简介

创建者：John Gruber
Markdown是一种可以使用普通文本编辑器编写的标记语言，通过简单的标记语法，它可以使普通文本内容具有一定的格式。Markdown具有一系列衍生版本，用于扩展Markdown的功能（如表格、脚注、内嵌HTML等等），这些功能原初的Markdown尚不具备，它们能让Markdown转换成更多的格式，例如LaTeX，Docbook。Markdown增强版中比较有名的有Markdown Extra、MultiMarkdown、 Maruku等。这些衍生版本要么基于工具，如Pandoc；要么基于网站，如GitHub和Wikipedia，在语法上基本兼容，但在一些语法和渲染效果上有改动。

此学习笔记书写验证工具：

Visual Studio Code V1.42.1

MPE : Markdown Preview Enhanced (MPE) V0.5.2

编辑整理: Bright Stone

编辑日期: 2020年2月20日

邮件地址: pltkib.stone@gmail.com

1. MarkDown的注释写法

第一种方法(区块注释)

<div style='display: none'>
下面这些行的文字并不会在文档Preview中显示出来...
下面这些行的文字并不会在文档Preview中显示出来...
下面这些行的文字并不会在文档Preview中显示出来...
</div>

第二种方法(逐行注释)

[comment]:&ensp;单行注释不会在文档Preview中显示出来...
[//]:&ensp;单行注释不会在文档Preview中显示出来...

2. import功能新试用

(VSCode 中 MPE支持的方式)

MPE: Markdown Preview Enhanced 非常方便强大的插件

书写方法： `@import "test.png"`

图片插入效果

3. Emoji的示例

书写方法： `:cry: :laughing: :angry:`

显示效果： 😢 😆 😠

4. 列表示例

书写方法：

| 项目 | 项目 | 项目 | 项目 | 项目 |
|----|----|----|----|----|
| 用途 | 用途 | 用途 | 用途 | 用途 |
| 目的 | 目的 | 目的 | 目的 | 目的 |

显示效果：

项目	项目	项目	项目	项目
用途	用途	用途	用途	用途
目的	目的	目的	目的	目的

5. 数学公式的写法：

数学公式输入方法一：

$$
f(x_1,x_2,\ldots,x_n) = x_1^2 + x_2^2 + \cdots + x_n^2
$$

显示效果:

$f(x_1,x_2,\ldots,x_n) = x_1^2 + x_2^2 + \cdots + x_n^2$

数学公式输入方法二：

<center>

$x = {-b \pm \sqrt{b^2-4ac} \over 2a}$

</center>

显示效果：

$\pm \sqrt{b^2-4ac} \over 2a}$

6. 标题字号自动控制

H1标题 `# H1标题`

H2标题 `## H2标题`

H3标题 `### H3标题`

H4标题 `#### H4标题`

H5标题 `##### H5标题`

H6标题 `###### H6标题`

7. 设置一个锚点跳转到该处

书写方法： `<span id="jumphere"> !!! 跳转到这里 !!!</span>`

!!! 跳转到这里 !!!

8. 可以跳转的目录结构

书写方法：

[1.语法示例](#1)
&nbsp;&nbsp;[1.1顺序执行](#1.1)
&nbsp;&nbsp;[1.2条件判断](#1.2)
&nbsp;&nbsp;[1.3循环重复](#1.3)

9. 引用书写

书写方法:

> 第一层引用
> 
> > 第二层引用
> > 第二层引用。。。。。
> > 第二层引用。。。。。
> > 第二层引用。。。。。
> > 
> > > 第三层引用。。。。。
> > > 第三层引用。。。。。
> > > 第三层引用。。。。。
> > > 第三层引用。。。。。
> > > 第三层引用。。。。。
> > > 第三层引用。。。。。

显示效果

第一层引用

第二层引用
第二层引用。。。。。
第二层引用。。。。。
第二层引用。。。。。

第三层引用。。。。。
第三层引用。。。。。
第三层引用。。。。。
第三层引用。。。。。
第三层引用。。。。。
第三层引用。。。。。

10. 列表书写方法

10.1 无序列表的示例

书写方法

* item
+ item
- item

显示效果

item-1 *
item-2 *
item-3 *

item-1 +
item-2 +
item-3 +

item-1 -
item-2 -
item-3 -

10.2 有序列表的示例

10.2.1 书写方法

1. Line-1
2. Line-2
3. Line-3

10.2.1 显示效果

Line-1
Line-2
Line-3

10.2.2 书写方法

<ol>
    <li>Bird</li>
    <li>McHale</li>
    <li>Parish</li>
</ol>

10.2.2 显示效果

Bird
McHale
Parish

11. URL链接插入示例

书写方法

1、[简书-MarkDown-语法大全超级版](https://www.jianshu.com/p/ebe52d2d468f)  
2、[Markdown语法介绍](https://blog.csdn.net/afei__/article/details/80717153)

1、简书-MarkDown-语法大全超级版
2、Markdown语法介绍

加入空行的方法（ ）

12. 代码引用方法(以Python示例)

书写方法: ```python …程序语句…```

显示效果:

import os
for i in range(1,100):
    print("[%d^2]=%d"%(i,i**2))

#13. 插入横线的方法
*** 三个（或以上）星就可以

14. 跳转目标写法

下面例子是为了显示目录跳转的方法

（点击前面的目录可以跳转到这里的目录所指详细内容）

写法：<h2 id="1">1.语法示例</h2>

1.语法示例

语法示例-行1
语法示例-行2
语法示例-行…
语法示例-行n

写法：<h3 id="1.1">1.1顺序执行</h3>

1.1顺序执行

顺序执行-行1
顺序执行-行2
顺序执行-行…
顺序执行-行n

写法：<h3 id="1.2">1.2条件判断</h3>

1.2条件判断

条件判断-行1
条件判断-行2
条件判断-行…
条件判断-行n

写法：<h3 id="1.2">1.2条件判断</h3>

1.3循环重复

循环重复行1
循环重复行2
循环重复行…
循环重复行n

15. 跳转到某处的写法

书写方法: `[点击跳转](#jumphere)`

#点击跳转

16. URL链接的插入示例

书写方法:

可以在 [百度](https://www.baidu.com/) 或者 [CSDN](https://www.csdn.net/) 或者 [必应](http://search.msn.com/) 进行搜索

显示效果:

可以在百度或者 CSDN 或者必应进行搜索

16.脚注的写法

书写方法:

这是第二个有注脚的文本，脚注[^1]、脚注[^2]与脚注[^3]
[^1]:第一条注脚内容
[^2]:第二条注脚内容
[^3]:第三条注脚内容

显示效果:

这是第二个有注脚的文本，脚注¹、脚注²与脚注³

17. 文字颜色，背景色，字体设置

书写方法

<div style='display: none'>
    bgcolor = #ff5c6d  ===> 背景颜色这样#rrggbb 16进制也是可以的
</div>

<table><tr><td bgcolor=orange>背景色是：orange</td></tr></table>

<table><tr><td bgcolor=cyan>

<font color=red size=6 face=“黑体”>字体颜色</font>
<font color=red face="黑体">我是黑体字</font>
<font color=red face="宋体">我是宋体字</font>
<font color=red face="微软雅黑">我是微软雅黑字</font>
<font color=red face="fantasy">我是fantasy字</font>
<font color=red face="Helvetica">我是Helvetica字</font>
<font size="12">12号字体</font>
<font size="8">8号字体</font>
<font color="red" size="14">红色-字号-14的字体</font>
<font face="微软雅黑" size="8" ><b><i><u>这是黑色的微软雅黑</u></i></b></font>
<b>加粗</b>
<i>斜体</i>
<u>下划线</u>

</td></tr></table>

显示效果(请注意有些Markdown文档编辑器对HTML TAG不支持)

字体设置显示效果

18. 空白行/半角空格/全角空格

Markdown 插入空白行写法： `\ `

Markdown 插入半角空格的写法： `\&ensp;`

1&ensp;2&ensp;3&ensp;4&ensp;5&ensp;6
1 2 3 4 5 6

Markdown插入全角空格的写法：`\&emsp;`

1&emsp;2&emsp;3&emsp;4&emsp;5&emsp;6
####1 2 3 4 5 6

19. 图片插入方法

书写方法

<center>

![经典照片](https://raw.githubusercontent.com/pltkib2020/images/master/pics/lena.jpg "LENA-图像处理经典照片")
经典图像图例照片
</center>

&nbsp;

<center>
<img src = "https://raw.githubusercontent.com/pltkib2020/images/master/pics/lena.jpg"
         alt = "Lena" height = "25%" width = "25%" border=10 />
</center>
<center>
The famous photo of image processing
</center>

显示效果

图片插入效果

20. 流程图与时序图的示例：