Markdown 教程

最新推荐文章于 2021-07-14 17:05:42 发布
最新推荐文章于 2021-07-14 17:05:42 发布
阅读量295 收藏
点赞数
分类专栏： 笔记 文章标签： markdown 笔记 文本记录
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_41596737/article/details/100126789
版权

之前一边学习一边记录的 Markdown 笔记，整理了一下希望能帮到更多人?

Markdown 是个好东西，希望大家都能花一个下午时间认真学会它。

内容目录



标题

MarkDown默认含六级标题，一级和二级往往会自带分隔线，会自动换行。

样例

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

注意井号后的空格

效果：（仅三级以下标题）

三级标题

四级标题
五级标题
六级标题

换行

两个以上的空格加回车实现换行（“|”表示空格边界）：

样例

第一行  |
第二行|

效果

第一行
第二行


两行之间插入一个空行表示新段落：

样例

第三行

第四行

默认情况一般会比换行有更宽的行间距（类似于内联元素与块元素的区别的原因）。

效果

第三行

第四行


使用HTML的br标签可以达到与双空格类似的效果：

样例

第五行

第六行

效果

第五行

第六行


字体样式

使用星号或者下划线实现字体样式。

样例

*斜体文本*
**粗体文本**
***粗斜体文本***

_斜体文本_
__粗体文本__
___粗斜体文本___

效果

斜体文本
粗体文本
粗斜体文本

斜体文本
粗体文本
粗斜体文本


删除线

样例

~~删除文本~~

效果

删除文本


下划线

样例

借助HTML的<u>标签实现：
<u>下划线文本</u>

效果

下划线文本


定制字体

可以借助HTML的font标签实现：

样例

<font color=#2196F3 size=1 face="宋体">大小为1的蓝色宋体</font>

效果

大小为1的蓝色宋体


居中

可以使用HTML的center标签。

样例

<center>居中文本</center>

效果

居中文本

注：有些编辑器可能并不支持相对HTML5来说过时的font标签与center标签。


分隔线

可以使用3个以上星号、减号、下划线独占一个段落，支持文间插入空格

样例

***

---

___

- - -

----------

效果

在整篇文章中，只使用其中一种形式为佳。


列表

无序列表使用 + - * 作为段落标记（效果相同，但并列的内容需要保持统一）：

样例

* 第一项
* 第二项
* 第三项
+ 第四项
- 第五项
- 第六项

与#用法类似，注意空格。

效果

  • 第一项
  • 第二项
  • 第三项
  • 第四项
  • 第五项
  • 第六项

有序列表使用“数字. 文本”的形式(注意“.”后跟着的空格)：

样例

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

效果

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

<br>尽管看上去没有变化，但是其列表属性会被记录下来。


列表嵌套需要在逐级在行首增加2个空格（或4个空格 或Tab制表符）。

样例

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

效果

  1. 第一级：
  • 第二级
    • 第三级
  • 第二级
    • 第三级
    • 第三级
  1. 第二项：
  • 第二级
  • 第二级

引用

引用采用>符号（后一般需要接空格）

样例

> 引用文本

效果

引用文本

<br>多段引用则“每行以’> '开头，以双空格结束为标准。
空行会打断引用。（“|”表示行的末尾）

样例

> 引用文本1  |
> 引用文本2  |
> 引用文本3|

> 错误引用文本1  |
  错误引用文本2（行首无“>”）|

效果

引用文本1
引用文本2
引用文本3

错误引用文本1
错误引用文本2（行首无“>”）

虽然错误用法可能可以正常显示，但有些情况（例如多重嵌套）会出现问题。


引用同样支持多级嵌套。（“|”表示行的末尾）

样例

> 第一级引用|
>> 第二级引用  |
>> 第二级引用|
>>> 第三级引用  |
第三级引用（不正确使用）|

效果

第一级引用

第二级引用
第二级引用

第三级引用
第三级引用（不正确使用）


不同符号的多重嵌套也是支持的，但需要注意顺序：

样例

> 引用区块
> - 引用区块中的一级列表  
>> - 第二级别引用区块中的一级列表
>>   - ##### 第五标题大小的二级列表

效果

引用区块

  • 引用区块中的一级列表
  • 第二级别引用区块中的一级列表
    • 第五标题大小的二级列表

代码文本

对于内联代码文本，使用反引号包裹代码可以正确还原代码显示（高亮\突出显示、等宽字体）。

样例

`code()`函数  
text()函数

效果

code()函数
text()函数


对于区块代码文本，可以使用三个反引号（```）包裹代码、
或者使用段缩进（4个空格或者一个Tab制表符）实现：

样例

```
function demo1 {
    alert("code block");
}
```

    function demo2 {
        alert("code block");
    }

效果

function demo1 {
    alert("code block");
}

function demo2 {
    alert("code block");
}

规范应该使用反引号作为区块代码为佳。


代码高亮
markdown支持对于不同语言针对关键字进行高亮。

```key
    代码文本
```

其中将“key”替换为对应的编程语言，“代码文本”替换为代码内容。

样例

```javascript
function demo {
    alert("keyword hightlight");
}
```

效果

function demo {
    alert("keyword hightlight text");
}

链接

链接有多种表示方式：

[链接名称](链接地址)
<链接地址>

注意网络地址需要为完整的URL链接，不可省略链接方式（如https）。
或者链接到相对地址（即相对于该md文件的服务器本地地址），则填写相对路径。

样例

<https://www.baidu.com>已经与我达成合作关系  
[该网站](https://www.baidu.com)会帮我解决你的所有问题。

这是我的[头像](img.jpg)

效果

https://www.baidu.com已经与我达成合作关系
该网站会帮我解决你的所有问题。

这是我的头像


还有以变量形式代替链接的方式：

样例

谷歌搜索入口 [Google][g]  
百度搜索入口 [Baidu][bd]

[g]: http://www.google.com/
[bd]: http://www.runoob.com/

效果

谷歌搜索入口 Google
百度搜索入口 Baidu


好处是将所有链接放在一起（如文末）便于后期管理。（变量全文皆可使用，故需要注意唯一性）

特别是链接个人的文件时，如改动文件夹会导致文件之间的层级关系变动，如果不使用该方法将很难维护藏在文中的链接。


图片

图片插入相比链接增加了一个感叹号（!）：

![图片名称](图片地址 "标题")

其所对应HTML中的img标签：

<img alt="图片名称" src="图片地址" title="标题">

其中标题是可选属性，其默认会在鼠标悬停图片上时显示；
图片名称默认则会在图片无法正常显示的情况下作为替代文本显示。
如果需要更好的修改图片属性，则推荐使用img标签的width等属性进行调节。
样例

![我的头像](https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2339538182,1553611410&fm=26&gp=0.jpg "看什么看")  
<img alt="你的头像" src="https://i-blog.csdnimg.cn/blog_migrate/8e6d3ae3df37390d298ffb7ee4888bb8.png" title="傻孩子">

效果 （图源网络，侵删）

我的头像
你的头像


图片同样支持使用变量代替网址。

样例

![百度logo][bdImg]

[bdImg]: https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1565549141841&di=cf7cc0e7c6731ed42177c59d9bfd31f1&imgtype=jpg&src=http%3A%2F%2Fimage.diyiyou.com%2F201902%2F22%2F1550812744_3.jpeg

效果

百度logo


表格

markdown表格使用“|”与“-”进行直观的绘制。
"-"和空格没有个数需求限制，如为了md源文件的美观可以尽量对齐。

样例

最简格式：

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

美观格式：

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

效果

最简格式：

表头表头
单元格单元格
单元格单元格

美观格式：

表头表头
单元格单元格
单元格单元格

对齐方式则需在第二行横线添加冒号“:”：

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

样例

| 左对齐 | 居中对齐 | 右对齐 |
| :---- | :-----: | ----: |
| 1     |    2    |     3 |
| 1     |    2    |     3 |

效果

左对齐居中对齐右对齐
123
123

对齐一般也会影响表头对齐方式（不同的编辑器解析效果不一定相同）。
默认对齐一般是左对齐（即无冒号）


待办事项

样例

- [ ] 未完成事项
- [x] 已完成事项

效果

  • 未完成事项
  • 已完成事项

不一定被支持的功能

以下功能非标准 markdown 规范，可能不被所有编辑器支持，或者在不同的编辑器下有不同的语法规范，具体以使用的编辑器为准。

这里以 CSDN 的 Markdown 编辑器为例。

注释

#样例

这是一段测试文本

*[测试文本]: 注释内容

#效果

这是一段测试文本


脚注

脚注一般会在文末显示(也可能不显示)。

#样例

这是一个脚注的链接[^脚注]

[^脚注]:脚注链接

#效果

这是一个脚注的链接1


以下是其他技巧：

HTML元素

markdown 支持很多 HTML 元素，可以补充 markdown 某些不具备的高级效果。

样例

使用 <kbd>Ctrl</kbd>+<kbd>Alt</kbd>+<kbd>Del</kbd> 重启电脑

效果

使用 Ctrl+Alt+Del 重启电脑


转义

markdown使用转义字符“\”对以下字符进行转义

\反斜线
`反引号
*星号
_下划线
{}花括号
[]方括号
()小括号
#井字号
+加号
-减号
.英文句点
!感叹号

公式

使用两个美元符号（$$）包裹 LaTeX 代码可以在 markdown 中插入 LaTeX 格式的数学公式。
（不一定被编辑器所支持，如 github 的 md 预览）

样例

$$
\mathbf{V}_1 \times \mathbf{V}_2 =  \begin{vmatrix} 
\mathbf{i} & \mathbf{j} & \mathbf{k} \\
\frac{\partial X}{\partial u} &  \frac{\partial Y}{\partial u} & 0 \\
\frac{\partial X}{\partial v} &  \frac{\partial Y}{\partial v} & 0 \\
\end{vmatrix}
$$

效果

V 1 × V 2 = ∣ i j k ∂ X ∂ u ∂ Y ∂ u 0 ∂ X ∂ v ∂ Y ∂ v 0 ∣ \mathbf{V}_1 \times \mathbf{V}_2 = \begin{vmatrix} \mathbf{i} &amp; \mathbf{j} &amp; \mathbf{k} \\ \frac{\partial X}{\partial u} &amp; \frac{\partial Y}{\partial u} &amp; 0 \\ \frac{\partial X}{\partial v} &amp; \frac{\partial Y}{\partial v} &amp; 0 \\ \end{vmatrix} V1​×V2​=∣∣∣∣∣∣​i∂u∂X​∂v∂X​​j∂u∂Y​∂v∂Y​​k00​∣∣∣∣∣∣​


其他

插件推荐

个人使用 Visual Studio Code 的 Markdown All in One 插件进行辅助编写 markdown。

目录生成

如使用带有 Markdown All in One 插件的 VS Code 编辑器，则可以按下F1键或者Ctrl+Shift+P后,输入ctoc即可根据标题在光标处生成目录。

对于不想被收录于目录里的标题，可以在标题后追加“<!-- omit in toc -->”即可。

Markdown规范

喜欢遵从规范编写的同学可以再下个markdown规范的插件如 markdownlint，你能够自动帮你揪出不规范的地方，很多时候虽然效果相同但是不够规范的话在特殊情况下可能会出错（但很少见），就是可能什么都提示会有点烦，有强迫症喜欢按规范的可以在刚开始学的时候试试~


后记

写完本篇笔记一段时间后想要将其发至 CSDN 上时发现其在第一次打开编辑器会有一篇完整的 markdown 使用教学！十分适合边学边动手测试，推荐大家结合着使用（缺点就是每项介绍都很简略，且某些只能在 CSDN 编辑器上使用）

CSDN 我上的比较少，笔记一般都在 github 上更新，欢迎大家访问我的笔记：github.com/HazeAcc/Notes


本文参考

Markdown 教程 | 菜鸟教程

（?下面是脚注内容）

  1. https://www.taobao.com/ ↩︎

ceynri
关注
专栏目录
Markdown教程
cike626的博客
08-13 378
Markdown是一种轻量级标记语言。通过简单的标记语法，它可以使普通文本内容具有一定的格式。由于Markdown的轻量化、易读易写特性，成为一种适用于网络的书写语言。同时，Markdown支持嵌入html标签。......
MarkDown教程
最新发布
qq_1126043450的博客
11-29 1210
Markdown是一种轻量级标记语言，广泛应用于程序员、国际杂志编辑和写作者等领域。它使用简单的符号（如星号、反引号、方括号、括号和井号）来标记文本格式，具有简洁的语法、优美的格式和强大的软件支持。Markdown的优势和应用领域包括：学习门槛低：相对于复杂的富文本编辑器，Markdown的语法简单易懂，学习成本低，几分钟就可以入门。广泛支持：许多平台和工具已经支持Markdown语法，包括GitHub、GitLab、GitBook、CSDN、WordPress、Typecho、知乎、有道云笔记、印象笔记、
markdown教程
dengjili的专栏
06-06 628
尝试了一下文档编辑markdown教程，托管在github上面 以后也打算尝试迁到github上写学习记录，大家也可以看看上面风格，也可以顺便百度一下百度gitbook，可以考虑写一本书，风格也挺不错的 markdown教程：github地址 主页截图 markdown截图 ...
CSDN官方markdown教程
qq_33982232的博客
12-09 723
本文转自https://blog.csdn.net/lzuacm/article/details/82758404 附 本文的Markdown源码: https://github.com/yanglr/AlgoSolutions/blob/master/Welcome_to_use_CSDN-markdown_Editor_new.md 点击”Raw”可看到源码，欢迎fork或star~ CSDN...
Markdown教程--Markdown图片
linus.lin的博客
07-14 1321
Markdown教程–Markdown图片 Markdown 图片语法格式如下： ![alt 属性文本](图片地址) ![alt 属性文本](图片地址 "可选标题") 开头一个感叹号 ! 接着一个方括号，里面放上图片的替代文字 接着一个普通括号，里面放上图片的网址，最后还可以用引号包住并加上选择性的 ‘title’ 属性的文字。 使用实例: ![RUNOOB 图标](http://static.runoob.com/images/runoob-logo.png) ![RUNOOB 图标](http
markdown教程及避坑指南(vscode).pdf
04-21
markdown是文档编辑器的神器，简单易用，...关键词：markdown教程 markdown用户手册 vscode markdown 插件 prince Markdown PDF Markdown All in One Markdown Preview Enhanced 避坑指南 使用经验总结 经典教程 MD .md
Markdown 教程.rar
07-31
这个“Markdown教程.rar”压缩包很可能是为了帮助用户学习和掌握Markdown语法而创建的。下面我们将深入探讨Markdown的基本概念、常用语法以及其在不同场景下的应用。 1. **Markdown基本概念** Markdown由John ...
MarkDown教程.pdf
06-20
在本Markdown教程中，我们将学习如何使用Markdown的基本语法来排版文档。首先，我们可以使用井号(#)来创建标题。标题的级别由井号的数量决定，一个井号表示一级标题，两个井号表示二级标题，以此类推。例如： # 这...
Markdown教程合集
01-31
这个“Markdown教程合集”包含了全面的学习资源，帮助用户掌握Markdown的基本语法和高级技巧，无论你是初学者还是希望提升Markdown技能的进阶用户，都能从中受益。 1. **基础语法** - **标题**：Markdown通过在行...
WSN无线传感器网络思维导图
山风的小角落
01-02 3026
WSN 无线传感器网络 笔记 1介绍 略 2物理层 面临的挑战 有限的带宽 有限的传输范围 信号衰减 多径散射 ...
在VS Code使用git时出现的英文字母缩写
山风的小角落
09-02 836
当编辑器打开项目文件的更根目录时，如果包含有 .git 文件，则会自动识别并标上符号与颜色。 D 表示已删除的文件 Deleted U 表示未跟踪的文件 Untracked M 表示修改过的文件 Modified 其他： R 表示更名了的文件 Renamed（暂存了更名前和更名后的文件改动后会显示此标记） A 新建的文件 Added（从零开始的文件） 相关插件 GitLens 插...
CSS 居中专项讲解
山风的小角落
10-06 713
title date CSS 居中专项讲解 2019/10/04 CSS 居中专项讲解 对于 CSS 新手来说，居中效果绝对是能排上前几的新手常见难题。 对于不同类型的元素的性质认识不够深刻，又常常在搜索解决方法时没能准确描述自己想要居中的元素的类型，导致出现诸如文本对齐的方法用在块元素上的错误。 关于...
JavaScript | 从 C、Java 语言到 JavaScript 语言的过渡笔记
山风的小角落
08-30 619
JavaScript | 入门基础 从 C、Java 语言到 JavaScript 语言的过渡笔记，以非零基础角度对JavaScript的基础语法内容及其特性进行适当的精炼所记录下的笔记，会省略或快速带过与Java和C语言相类似的部分内容。 目录 在网页中插入 JavaScript 代码 定义变量 现代模式 / 严格模式 模态窗交互 数据类型 1. number 类型 2. string 类...
JavaScript | 浏览器调试与代码测试
山风的小角落
09-02 596
介绍如何使用现代浏览器进行简单的代码调试与编写自动化测试。 目录 浏览器控制台 Chrome 调试快捷键 debugger 命令 日志记录 代码编写规范 自动化测试 常用库 样例 其他函数 其他断言 更多内容 浏览器控制台 在浏览器（如 Firefox 与 Chrome）中的控制台测试功能时，换行需要使用 Shift+Enter 键，单独的 Enter 键会...
JavaScript | 常用方法索引对照表
山风的小角落
09-02 548
摘录一些基础的常用的方法（且不限于方法，如属性、常量），在全面与精简中尽量作平衡。 表格内每一项时常以内在意义进行排序而非字母顺序排序，请善用 目录 与 Ctrl+F???? 目录 数据类型 Number String 其他 常用库 Math 对象 Objects Array Map Set HTML DOM 查找 HTML 元素 改变 HTML 元素 增删 HT...
JavaScript | HTML DOM
山风的小角落
09-02 391
JavaScript | HTML DOM（1） 文档对象模型 Document Object Model（DOM） 目录 什么是 HTML DOM？ HTML DOM模型能做什么 document 对象 DOM 动画 DOM 事件 代码调用方式 分配事件方式 事件种类 事件监听器 事件冒泡 / 事件捕获 更多内容 什么是 HTML DOM？ HTML D...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值