使用markdown写作
markdown14 分钟 读完 (大约 2097 个字)

使用markdown写作

markdown是一种简单的文本标记语言，本篇文章也是用markdown写的。

markdown可以用于微信公众号、简书、知乎以及hexo、wordpress等等文章的书写。

markdown文件的扩展名为.md。

markdown文件借助一些markdown编辑器比如Typora就可以导出为pdf、html、word、epub、LaTex、Media Wiki等文件格式。

以上的<!-- more -->是hexo中用来分割summary和article的语法。

推荐阅读书籍《了不起的Markdown》，不过掌握一个markdown好像也不需要专门读一本书。

目录

用来生成文章目录，看渲染器是否支持。

1
[toc]

标题

1
2
3
4
5
6
# h1
## h2
### h3
#### h4
##### h5
###### h6
1
2
3
4
5
一级标题
=======

二级标题
-------

文本

基本文本样式

1
2
3
4
5
*斜体*
**粗体**
***粗体斜体***
~~删除线~~
<u>下划线</u>

脚注

1
2
需要添加角注的内容[^角注标题]
[^角注标题]: 角注内容

段落

用一个空行来表示开启一个新的段落。

列表

  1. 列表可以与列表嵌套。

  2. 引用可以与列表互相嵌套。

无序列表

使用-或者* +，以下使用-。

1
2
- item1
- item2
1
2
3
4
5
- item1
	- item1.1
- item2
	- item2.1
	- item2.2

有序列表

1
2
1. item1
2. item2

清单

1
2
3
- [ ] 买衣服
- [ ] 买菜
- [ ] 学习

引用

引用可以与列表互相嵌套。

单行：

1
> 这是一段引用的内容

多行：

1
2
3
> row1
> row2
> row3

嵌套：

1
2
3
> 第一层引用
> > 第二层引用
> > > 第三层引用

分割线

1
2
3
---
***
+++

表格

Markdown制作表格使用 |来分隔不同的单元格，使用- 来分隔表头和其他行。

根据冒号的位置决定对齐方式。

语法：

1
2
3
4
|  表头   | 表头  |
|  ----  | ----  |
| 单元格  | 单元格 |
| 单元格  | 单元格 |

示例：

1
2
3
| 姓名 | 性别 | 年龄 |
| :-- | --: | :--: |
| 小明 |  男  |  12  |
姓名 性别 年龄
小明 男 12

链接

基本链接

alt可以省略。

1
2
3
[title](url "alt")
或者
<url>

高级链接

  1. 文档最下方先定义变量。
  2. 在文档中引用，给定链接名称和变量名。
1
2
[谷歌官网][google]
[google]: https://www.google.com/

图片

基本用法

1
![title](url "alt")

高级用法

高级用法同高级链接，先定义变量和值，再在文中引用链接名称和变量名。

1
2
[风景图片][view]
[view]: image_url

其他用法

markdown无法指定图片宽高，可以使用<img>标签代替。

1
<img src="http://static.runoob.com/images/runoob-logo.png" width="50%">

代码

小段代码 ，类似于行内元素：

1
`code`

大段代码 ，类似于块元素：

先写三个反引号，紧接着加上语言，然后换行写代码，再在最后一行写三个反引号。

这里markdown中嵌套代码无法被hexo正确解析，所以不放代码了。

高级用法

支持的html标签

markdown支持的html标签：kbd b i em sup sub br等等。

1
2
3
4
5
6
7
<kbd>ctrl</kbd>
<b>加粗</b>
<i>斜体</i>
<em>强调</em>
<sup>上标</sup>
<sub>下标</sub>
<br>换行

转义字符

在特殊符号前面加上\来表示该符号。

1
\*

公式

当你需要在编辑器中插入数学公式时，可以使用两个美元符$$ 包裹TeX 或 LaTeX格式的数学公式来实现。提交后，问答和文章页会根据需要加载 Mathjax 对数学公式进行渲染。如：

1
2
3
4
5
6
7
8
$$
\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}
${$tep1}{\style{visibility:hidden}{(x+1)(x+1)}}
$$

流程图

代码来自菜鸟教程

hexo无法解析流程图，故而在本博客看不到效果。

故而hexo只能使用制图软件作图

下面的代码都要放在三个反引号包裹的代码块内。

  1. 横向流程图

语言：mermaid

1
2
3
4
5
6
graph LR
A[方形] -->B(圆角)
    B --> C{条件a}
    C -->|a=1| D[结果1]
    C -->|a=2| E[结果2]
    F[横向流程图]

效果：

1
2
3
4
5
6
graph LR
A[方形] -->B(圆角)
    B --> C{条件a}
    C -->|a=1| D[结果1]
    C -->|a=2| E[结果2]
    F[横向流程图]
  1. 竖向流程图

语言：mermaid

1
2
3
4
5
6
graph TD
A[方形] --> B(圆角)
    B --> C{条件a}
    C --> |a=1| D[结果1]
    C --> |a=2| E[结果2]
    F[竖向流程图]

效果：

1
2
3
4
5
6
graph TD
A[方形] --> B(圆角)
    B --> C{条件a}
    C --> |a=1| D[结果1]
    C --> |a=2| E[结果2]
    F[竖向流程图]
  1. 标准流程图

语言：flow

1
2
3
4
5
6
7
8
9
st=>start: 开始框
op=>operation: 处理框
cond=>condition: 判断框(是或否?)
sub1=>subroutine: 子流程
io=>inputoutput: 输入输出框
e=>end: 结束框
st->op->cond
cond(yes)->io->e
cond(no)->sub1(right)->op

效果：

1
2
3
4
5
6
7
8
9
st=>start: 开始框
op=>operation: 处理框
cond=>condition: 判断框(是或否?)
sub1=>subroutine: 子流程
io=>inputoutput: 输入输出框
e=>end: 结束框
st->op->cond
cond(yes)->io->e
cond(no)->sub1(right)->op
  1. 标准流程图（横向）

语言：flow

1
2
3
4
5
6
7
8
9
st=>start: 开始框
op=>operation: 处理框
cond=>condition: 判断框(是或否?)
sub1=>subroutine: 子流程
io=>inputoutput: 输入输出框
e=>end: 结束框
st(right)->op(right)->cond
cond(yes)->io(bottom)->e
cond(no)->sub1(right)->op

效果：

1
2
3
4
5
6
7
8
9
st=>start: 开始框
op=>operation: 处理框
cond=>condition: 判断框(是或否?)
sub1=>subroutine: 子流程
io=>inputoutput: 输入输出框
e=>end: 结束框
st(right)->op(right)->cond
cond(yes)->io(bottom)->e
cond(no)->sub1(right)->op
  1. UML时序图

语言：sequence

1
2
3
4
5
对象A->对象B: 对象B你好吗?（请求）
Note right of 对象B: 对象B的描述
Note left of 对象A: 对象A的描述(提示)
对象B-->对象A: 我很好(响应)
对象A->对象B: 你真的好吗？

效果：

1
2
3
4
5
对象A->对象B: 对象B你好吗?（请求）
Note right of 对象B: 对象B的描述
Note left of 对象A: 对象A的描述(提示)
对象B-->对象A: 我很好(响应)
对象A->对象B: 你真的好吗？
  1. UML时序图（复杂）

sequence

1
2
3
4
5
6
7
8
9
10
11
Title: 标题：复杂使用
对象A->对象B: 对象B你好吗?（请求）
Note right of 对象B: 对象B的描述
Note left of 对象A: 对象A的描述(提示)
对象B-->对象A: 我很好(响应)
对象B->小三: 你好吗
小三-->>对象A: 对象B找我了
对象A->对象B: 你真的好吗？
Note over 小三,对象B: 我们是朋友
participant C
Note right of C: 没人陪我玩

效果：

1
2
3
4
5
6
7
8
9
10
11
Title: 标题：复杂使用
对象A->对象B: 对象B你好吗?（请求）
Note right of 对象B: 对象B的描述
Note left of 对象A: 对象A的描述(提示)
对象B-->对象A: 我很好(响应)
对象B->小三: 你好吗
小三-->>对象A: 对象B找我了
对象A->对象B: 你真的好吗？
Note over 小三,对象B: 我们是朋友
participant C
Note right of C: 没人陪我玩
  1. UML时序图（标准）

语言：mermaid

1
2
3
4
5
6
7
8
9
10
11
12
%% 时序图例子,-> 直线，-->虚线，->>实线箭头
  sequenceDiagram
    participant 张三
    participant 李四
    张三->王五: 王五你好吗？
    loop 健康检查
        王五->王五: 与疾病战斗
    end
    Note right of 王五: 合理 食物 <br/>看医生...
    李四-->>张三: 很好!
    王五->李四: 你怎么样?
    李四-->王五: 很好!

效果：

1
2
3
4
5
6
7
8
9
10
11
12
%% 时序图例子,-> 直线，-->虚线，->>实线箭头
  sequenceDiagram
    participant 张三
    participant 李四
    张三->王五: 王五你好吗？
    loop 健康检查
        王五->王五: 与疾病战斗
    end
    Note right of 王五: 合理 食物 <br/>看医生...
    李四-->>张三: 很好!
    王五->李四: 你怎么样?
    李四-->王五: 很好!
  1. 甘特图

语言：mermaid

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
%% 语法示例
        gantt
        dateFormat  YYYY-MM-DD
        title 软件开发甘特图
        section 设计
        需求                      :done,    des1, 2014-01-06,2014-01-08
        原型                      :active,  des2, 2014-01-09, 3d
        UI设计                     :         des3, after des2, 5d
    未来任务                     :         des4, after des3, 5d
        section 开发
        学习准备理解需求                      :crit, done, 2014-01-06,24h
        设计框架                             :crit, done, after des2, 2d
        开发                                 :crit, active, 3d
        未来任务                              :crit, 5d
        耍                                   :2d
        section 测试
        功能测试                              :active, a1, after des3, 3d
        压力测试                               :after a1  , 20h
        测试报告                               : 48h

效果：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
%% 语法示例
        gantt
        dateFormat  YYYY-MM-DD
        title 软件开发甘特图
        section 设计
        需求                      :done,    des1, 2014-01-06,2014-01-08
        原型                      :active,  des2, 2014-01-09, 3d
        UI设计                     :         des3, after des2, 5d
    未来任务                     :         des4, after des3, 5d
        section 开发
        学习准备理解需求                      :crit, done, 2014-01-06,24h
        设计框架                             :crit, done, after des2, 2d
        开发                                 :crit, active, 3d
        未来任务                              :crit, 5d
        耍                                   :2d
        section 测试
        功能测试                              :active, a1, after des3, 3d
        压力测试                               :after a1  , 20h
        测试报告                               : 48h

喜欢这篇文章？打赏一下作者吧

评论

关注我

链接

分类

最新文章

归档

标签

二分查找1
二叉树1
二维数组1
动态规划2
双指针1
字符串1
排序1
数学1
数组3
树1
递归2
链表2

订阅更新

×