markdown使用

前言

参考链接：

• 官网：https://markdown.com.cn/

2020 年的时候，有个小伙子坐我旁边，我看到了他用 Hexo 搭建的博客，以及使用 Markdown 编写的文章，我当时就觉得这个文档好清爽。之后经过自己的使用，越来越感觉这是一个了不起的发明，它可以使用html标签来编写文档，这个想法真是太棒了。

通过 html 标签我们可以实现精美的页面，将其优势带入到我们的文档当中，就能感觉到，它在很多方面比 word 强大太多了，而且编辑快速高效。

Markdown 是一种轻量级的标记语言，可用于在纯文本文档中添加格式化元素。Markdown 由 John Gruber 于 2004 年创建，如今已成为世界上最受欢迎的标记语言之一。

其设计理念——致力于使阅读和创作的文档变得更容易。目前而言，我看各个论坛都支持了使用 Markdown 的格式创建文件，今后其将会变得无处不在。

Markdown 的一些使用方式

像那些基本的使用方式就不写了，网上有很多优秀的文章，也可以参考官方教程。我这边就记录一些自己遇到的问题。

图片

Markdown 的图片上传之前一直困扰着我。Markdown 插入本地图片，之后的文章自己看还好，这样就比较简单，直接引用本地图片即可。但如果文章要发到网上呢？最好的方式是通过网络引用图片。虽然可以通过 base64 的方式将图片插入到文档，但 base64 有个数据膨胀的问题。

我使用的是图床的方式，是我认为图片引用最简单，最清晰的方式。我使用的图床是腾讯云的COSBrwoser，免费空间只有5G好像，如果只是放一些截图啥的，一辈子够用了。具体怎么操作我就不展开说了，网上有很多不错的教程，也很简单。

cosbrowser客户端下载链接：

• https://github.com/tencentyun/cosbrowser/blob/master/README.md

表格

表格的方式类似于用边框线自己”画“出表格，比如下面内容：

|姓名|性别|年龄|
|---|---|---|
|test|男|23|
|test2|女|23|

它的实现效果是：

姓名	性别	年龄
test	男	23
test2	女	23

我看很多博客上介绍关于表格的语法时，例子都是比较规整的，我的要求就没那么高了，越简单使用越好。

代码框

代码框对于程序员来说特别实用，只需要用```引用即可。比如 C 语言程序：

常用数学公式符号

Markdown 的数学公式的标识符以$$开始，以$$结尾。如：

$$a^2 + b^2 = c^2$$

关于数学公式这部分网上已经有写的比较好的了，参考链接：

• https://blog.csdn.net/aaronfo/article/details/49738791

增加目录

很简单，只需要在需要增加目录的地方输入[toc]加回车，Markdown 即可自动根据标题及标题等级生成目录。

emoji 表情

有时候我们现在文章中插入一点儿 emoji 表情，直接输入表情符号代码就可以了，比如：😢 ，更多表情符号代码可以查阅参考链接。

流程图

参考链接：

• 在线流程图渲染器：Online FlowChart & Diagrams Editor（国内可能比较慢）
• mermaid github：https://github.com/mermaid-js/mermaid
• mermaid 文档：https://mermaid-js.github.io/mermaid/#/
• https://vincentruan.github.io/2020/02/04/Mermaid-实用教程/
• https://blog.csdn.net/zywvvd/article/details/110150617
• https://code.z01.com/doc/mdflow.html

Markdown 如何使用流程图？先用其他工具画好，再截图，再以图片的形式引用进 md 文件？NO，NO，NO。Markdown 语法是支持流程图的——这样说不准确。应该是：markdown

md 文件中支持引入其他语言语法，再通过支持其他语法的 md 编辑器进行渲染，Markdown 只是提供了一个引入，它的强大离不开其编辑器的强大。

Markdown 支持的图表类型共有三种：

• 流程图：指定mermaid（样式流程图）或flow（标准流程图）解析语言
• 时序图：指定mermaid（样式流程图）或sequence（标准时序图）解析语言
• 甘特图：指定mermaid（样式流程图）解析语言

在学习几种图表类型之前，不妨先学习一下解析语言。

从 Markdown 支持的图表类型来看，mermaid支持的流程图类型最广。这可能也是一个趋势，其他两种我就略过不学了，吾生也有涯，而知也无涯，以有涯随无涯，殆己。

mermaid

mermaid （美人鱼）是一个基于 JavaScript 的图表工具，帮助文档跟上时代发展的步伐。支持的图表类型有：流程图、序列图、类图、状态图、实体关系图、用户旅程、甘特图、饼形图、需求图、Gitgraph 图、C4C 图等。一般来讲是满足普通用户需求的。我试过flow类型的流程图，也挺方便使用的，每一种都有一些可取之处，emm，嗯。

echarts

参考链接：

• https://www.runoob.com/echarts/echarts-tutorial.html
• https://ld246.com/article/1568951806108
• https://juejin.cn/post/6844904170420437005#heading-23
• https://hexo.fluid-dev.com/posts/hexo-echarts/

偶然间得知了echarts这个神奇的东西，真是太神奇了。通过它，我们就可以在 markdown 中插入各种交互式地统计图表，实在是太漂亮了，有一种霍克沃茨魔法学校中的报纸一样。

不过，我现在还用不上，保留。

MD编辑器推荐

推荐Typora，为啥只推荐它，因为我主要用它😰。。。

它有如下优势：

• 各个平台都有，都可以使用，还支持扩展，很多 Markdown 的语法可以通过编辑器本身自带的快捷键实现
• 可以导出为word、Epub、LaTeX、pdf、HTML等多种格式
• 它可以用标签语言的方式编辑，也可以用“预览“的方式编辑，这样文章的效果更加直观
• 强大的渲染

它之前是免费的，但现在已经收费了，80多块钱支持三个终端，愿不愿意付费就看个人了。

其他的像 Vscode 也有支持 Markdown 的插件，具体使用的体验怎么样我不太清楚，只用它写过一些简单的东西。在网上看到有人推：

• notion
• arya：https://markdown.lovejade.cn/

等，感兴趣也可以试一下。

总结

Markdown 使用习惯之后还是很好用的，建议每个有文档编辑需求的朋友都试一下，学习成本也不是很高，万一结果让你很惊喜呢？

现在这份 Markdown 的学习笔记特别初级，之后在使用过程中遇到的问题都会记录进来。