注:本文部分内容由于不支持不能完全显示,请移步
https://www.zybuluo.com/code009/note/1465644
{#顶部}
Markdown简述
Markdown是一种纯文本格式的标记语言。通过简单的标记语法,它可以使普通文本内容具有一定的格式。非常适合于写文档、博客和笔记。
Markdown优缺点分析
Markdown优点:
- 纯文本内容,兼容所有的文本编辑器与字处理软件
- 格式转换方便,轻松的导出 HTML、PDF 和本身的 .md 文件
- 可读、直观、学习成本低
- 专注你的文字内容而不是排版样式,安心写作
- 支持 HTML 标签
Markdown缺点:
- 没有像word一样格式的花哨
- 不支持复杂的格式
- 有太多不兼容的方言。由于原始的Markdown支持的格式有限,所以出现了很多不同的扩展,这些扩展之间的不兼容性是一个问题
- markdown没有被标准化,其版本较多,给人感觉有点混乱,因为github的关系,当前比较流行的是markdown是gfm
1. 分级标题
1.1 形式一(类 Atx )
在行首插入1到6个#
,对应1到6阶标题。
例:
# 一级标题
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题
效果:
一级标题
二级标题
三级标题
四级标题
五级标题
六级标题
1.2 形式二(类 Setext )
在文字下添加=
表示最高阶标题,添加-
表示第二阶标题。
例:
大标题
=====
小标题
----
效果:
大标题
小标题
2. 分割线(不同类型的编辑器显示分割线的效果可能不同)
在一行中用三个以上的 *、-、_ 来建立一个分隔线,行内不能有其他东西。也可以在星号或是减号中间插入空格。
例:
***
---
_ _ _
效果:
3. 列表
3.1 无序列表
在文字前加 *
、-
或+
例:
* 无序列表一
* 无序列表二
或
+ 无序列表一
+ 无序列表二
或
- 无序列表一
- 无序列表二
效果:
- 无序列表一
- 无序列表二
3.2 有序列表
在文字前面加上1.
2.
3.
。(序号和文本中间要有空格)
例:
1. 有序列表一
2. 有序列表二
效果:
- 有序列表一
- 有序列表二
3.3 列表嵌套
列表内部使用列表。
例:
- 外部列表项一
- 内部列表项一
- 内部列表项二
- 外部列表项二
效果:
- 外部列表项一
- 内部列表项一
- 内部列表项二
- 外部列表项二
3.4 待办事宜TODO列表
使用带有 [ ] 或 [x] (未完成或已完成)项的列表语法撰写一个待办事宜列表,并且支持子列表嵌套以及混用Markdown语法。
例:
- [ ] **Cmd Markdown 开发**
- [ ] 改进 Cmd 渲染算法,使用局部渲染技术提高渲染效率
- [ ] 支持以 PDF 格式导出文稿
- [x] 新增Todo列表功能
- [x] 改进 LaTex 功能
- [x] 修复 LaTex 公式渲染问题
- [x] 新增 LaTex 公式编号功能
- [ ] **七月旅行准备**
- [ ] 准备邮轮上需要携带的物品
- [ ] 浏览日本免税店的物品
- [x] 购买蓝宝石公主号七月一日的船票
效果:
- [ ] Cmd Markdown 开发
- [ ] 改进 Cmd 渲染算法,使用局部渲染技术提高渲染效率
- [ ] 支持以 PDF 格式导出文稿
- [x] 新增Todo列表功能 语法参考
- [x] 改进 LaTex 功能
- [x] 修复 LaTex 公式渲染问题
- [x] 新增 LaTex 公式编号功能 语法参考
- [ ] 七月旅行准备
- [ ] 准备邮轮上需要携带的物品
- [ ] 浏览日本免税店的物品
- [x] 购买蓝宝石公主号七月一日的船票
4. 插入超链接
4.1 行内式
语法:[显示文本](链接地址 "title")
title 可选,设置以后,鼠标悬停在超链接上会显示该title。
例:
[我的GitHub](https://github.com/MrChenYoung)
[我的GitHub](https://github.com/MrChenYoung "我的GitHub")
效果:
我的GitHub
我的GitHub
4.2 参考式
参考式可以在一个地方统一管理链接,如果一个链接在文章中多次使用,使用这种方式起到链接复用的功能。
语法: [链接文字][链接标记]
在文章的任意位置添加 [链接标记]:链接地址 "链接标题"
,如果链接文字可以作为链接标记,可以简写为[链接文字][]
例:
[我的GitHub][1]
或
[GitHub主页][]
效果:
[我的GitHub][2]
或
[GitHub主页][]
4.3 自动链接
自动链接是一种简便的处理网址或邮箱的方式,用<>把网址或邮箱包起来就会自动转换成链接。显示的链接文字和链接地址一样。
语法: <链接地址>
例:
效果: https://github.com/MrChenYoung
5. 锚点(在Markdown预览页无效,文章发布以后在网页上才有效)
锚点是实现文章内部跳转的链接。
语法: 首先在要跳转到的位置设置锚点: {#标记名}
,然后再点击跳转的地方设置跳转的地方: [显示跳转文字](#标记名)
例:
回到[顶部](#顶部)
效果: 回到顶部
6. 插入图片
6.1 行内式
语法:[图片上传失败...(image-3c0aa4-1556539983652)]
图片路径可以是本地图片路径,也可以是网络图片路径。Alt text 和 title 是可选的项;Alt text 表示图片下面显示的文字(部分编辑器不支持),title 和 HTML 中 标签的 title 属性相似, 表示鼠标悬停在图片上显示的文字。
注: Markdown没法设置图片的大小,如果有需要可以使用 HTML 中的标签
例:
![喵星人](https://upload-images.jianshu.io/upload_images/2421826-b2e860959b39e4a1.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240 '小猫')
效果:
6.2 参考式
语法: ![Alt text][标记]
例:
![喵星人][3]
效果:
![喵星人][4]
7. 文本引用
7.1 单层引用
在要引用的文字前加>
,>
和文本中间留空格。(简便的写法是只在段落的第一行添加>
,引用内部可以嵌套其他markdown语法)
例:
桃花庵歌
桃花坞里桃花庵,
桃花庵下桃花仙;
桃花仙人种桃树,
又摘桃花卖酒钱。
酒醒只在花前坐,
酒醉还来花下眠;
半醒半醉日复日,
花落花开年复年。
但愿老死花酒间,
不愿鞠躬车马前;
车尘马足富者趣,
酒盏花枝贫者缘。
若将富贵比贫贱,
一在平地一在天;
若将贫贱比车马,
他得驱驰我得闲。
别人笑我太疯癫,
我笑他人看不穿;
不见五陵豪杰墓,
无花无酒锄作田。
7.2 多层嵌套引用
不同层次添加不同数量的>
实现引用的嵌套。
例:
> 第一层引用
>> 第二层引用
>>> 第三层引用
效果:
第一层引用
第二层引用
第三层引用
8. 代码引用
8.1 行内式
在要引用的代码首尾添加 ` 符号,用于插入一句代码。
例:
C语言里`scanf()`函数的用法
效果:
C语言里
scanf()
函数的用法
8.2 用6个`包裹代码
在要引用的代码首行和末行添加```符号。
例:
```
for i in 1..<5 {
print("\(i)")
}
```
效果:
for i in 1..<5 {
print("(i)")
}
8.3 缩进式多行代码
在要引入的代码前添加至少一个 Tab 或四个空格缩进。
例:
for i in 1..<5 {
print("\(i)")
}
8.4 代码高亮
语法:
```语言类型 代码 ````
例:
```swift
for i in 1..< 5 {
print("\(i)")
}
```
效果:
for i in 1..< 5 {
print("\(i)")
}
8.5 HTML 原始码
在代码区块里面, & 、 < 和 > 会自动转成 HTML 实体,这样的方式让你非常容易使用 Markdown 插入范例用的 HTML 原始码,只需要复制贴上,剩下的 Markdown 都会帮你处理。
例:
值班人员
星期一
星期二
星期三
李强
张明
王平
和
效果:
和
值班人员 星期一 星期二 星期三 李强 张明 王平
9. 字体
9.1 字体加粗
在要加粗的文字前后加上 ** 或 __(两个下划线)
例:
**粗体文字**
或
__粗体文字__
效果:
粗体文字
或
粗体文字
9.2 斜体文字
在斜体文字前后加上 * 或 _(单个下划线)
例:
*斜体文字*
或
_斜体文字_
效果:
斜体文字
或
斜体文字
9.3 斜体加粗文字
在文字前后加上 *** 或 ___(三个下划线)
例:
***斜体加粗文字***
或
___斜体加粗文字___
效果:
斜体加粗文字
或
斜体加粗文字
9.4 加删除线的文字(部分编辑器无效)
在文字的前后加上~~
例:
~~原价:198元~~
效果:
原价:198元
10. 注脚
语法: 首先在要加注的地方加注: 加注文字[^注脚名字]
,然后在文章任意地方(一般是文末)添加脚注:[^注脚名字]:解释
。
例:
Markdown[^1]可以高效的书写文档,转换成HTML[^2]。
效果:
Markdown[1]可以高效的书写文档,转换成HTML[2]。
11. 换行
Markdown中要实现换行,单独一个回车是实现不了的,要首先输入至少两个空格,然后回车,就实现下一行和当前行不在一行。
12. 表格
用|
和-
分割行列内容,:
表示对齐方式(默认左对齐)。
例:
原生方式:
| Tables | Are | Cool |
| ------------- |:-------------:| -----:|
| col 3 is | right-aligned | $1600 |
| col 2 is | centered | $12 |
| zebra stripes | are neat | $1 |
简单方式:
姓名 | 年龄 | 职业
-------:|:---------:|-----:
张三 | 18 | 律师
李四 | 20 |软件工程师
效果:
Tables Are Cool col 3 is right-aligned $1600 col 2 is centered $12 zebra stripes are neat $1
主要人员姓名 年龄 职业 张三 18 律师 李四 20 软件工程师
13. 特殊字符转换成普通字符
在Markdown的特殊字符前加上反斜杠转换成普通字符。
Markdown 支持以下这些符号前面加上反斜杠来帮助插入普通的符号:
符号 | 名称 | 示例 | 效果 |
---|---|---|---|
\ | 反斜线 | \\ |
\ |
` | 反引号 | \` |
` |
* | 星号 | \* |
* |
_ | 底线 | \_ |
_ |
{} | 花括号 | \{} |
{} |
[] | 方括号 | \[] |
[] |
() | 括号 | \() |
() |
# | 井号 | \# |
# |
+ | 加号 | \+ |
+ |
- | 减号 | \- |
- |
. | 英文句号 | \. |
. |
! | 感叹号 | \! |
! |
14. Markdown作图(部分编辑器不支持)
14.1 绘制流程图
将流程图代码包含在```folw和```之间。流程图代码分两步,第一步创建元素,第二步连接元素,两部之间用空行分割。流程图元素后可以跟上链接,点击元素跳转。
流程图元素
- 开始
st=>start: 开始 - 操作
op1=>operation: 操作、执行说明 - 条件
cond=>condition: 确认? - 子程序
sub1=>subroutine: 子程序操作说明 - 用户输入或输出
io1=>inputoutput: 输入输出 - 结束
e=>end: 结束
例1:
```flow
st=>start: 开始:> https://www.github.com
e=>end: 登录
io1=>inputoutput: 输入用户名密码
sub1=>subroutine: 数据库查询子类
cond=>condition: 是否有此用户
cond2=>condition: 密码是否正确
op=>operation: 读入用户信息
>
st->io1->sub1->cond
cond(yes,right)->cond2
cond(no)->io1(right)
cond2(yes,right)->op->e
cond2(no)->io1
```
效果:
st=>start: 开始:> https://www.github.com
e=>end: 登录
io1=>inputoutput: 输入用户名密码
sub1=>subroutine: 数据库查询子类
cond=>condition: 是否有此用户
cond2=>condition: 密码是否正确
op=>operation: 读入用户信息
st->io1->sub1->cond
cond(yes,right)->cond2
cond(no)->io1(right)
cond2(yes,right)->op->e
cond2(no)->io1
例2:
```flow
st=>start: 开始
rain?=>condition: 今天有雨吗?
takeAnUmbrella=>operation: 带伞
go=>operation: 出门
e=>end: 结束
>
st->rain?
rain?(yes)->takeAnUmbrella->go
rain?(no)->go->e
```
效果:
st=>start: 开始
rain?=>condition: 今天有雨吗?
takeAnUmbrella=>operation: 带伞
go=>operation: 出门
e=>end: 结束
st->rain?
rain?(yes)->takeAnUmbrella->go
rain?(no)->go->e
14.2 绘制序列图
序列图代码用```sequence和```包裹。
步骤:
- 设置title
- title:序列图标题
- 设置participant(参与者)
- participant:actor
- 设置Note
- Note left of A(左侧note)
- Note right of A(右侧note)
- Note over A(覆盖A)
- Note over B,C(覆盖多个actor)
- 设置会话(actor->actor:message、actor-->actor:message、actor->>actor:message、actor-->>actor:message)
- A->A:自言自语
- A->B:实线实箭头
- A-->B:虚线实箭头
- A->>B:实线虚箭头
- A-->>B:虚线虚箭头
例1:
```sequence
Title:作业通知提交序列图
participant 教师
participant 班长
participant 同学们
教师-->班长:通知明天交作业
Note left of 教师:通知
班长-->同学们:记得明天交作业
同学们->班长:了解
同学们-->教师: 交作业
note right of 同学们:作业
```
效果:
Title:作业通知提交序列图
participant 教师
participant 班长
participant 同学们
教师-->班长:通知明天交作业
Note left of 教师:通知
班长-->同学们:记得明天交作业
同学们->班长:了解
同学们-->教师: 交作业
note right of 同学们:作业
例2:
```sequence
participant 客户端
participant 控制器
participant 业务
participant 数据库
>
客户端->控制器:提交店铺数据
Note right of 客户端:提交数据javascript进行验证
控制器->控制器:验证数据完整性
Note left of 控制器:返回错误的字段信息
控制器-->客户端:数据不完整
控制器->业务:保存店铺到数据库
业务->业务:save店铺数据
业务-->控制器:保存出现异常
控制器-->客户端:save异常,提示客户端
业务->数据库:保存成功
数据库-->业务:success
业务-->控制器:success
控制器-->客户端:success 客户端
Note left of 控制器:返回正确的提示,并跳转到审核第二步
```
效果:
participant 客户端
participant 控制器
participant 业务
participant 数据库
客户端->控制器:提交店铺数据
Note right of 客户端:提交数据javascript进行验证
控制器->控制器:验证数据完整性
Note left of 控制器:返回错误的字段信息
控制器-->客户端:数据不完整
控制器->业务:保存店铺到数据库
业务->业务:save店铺数据
业务-->控制器:保存出现异常
控制器-->客户端:save异常,提示客户端
业务->数据库:保存成功
数据库-->业务:success
业务-->控制器:success
控制器-->客户端:success 客户端
Note left of 控制器:返回正确的提示,并跳转到审核第二步
#### 14.3 绘制甘特图吃(部分编辑器不支持)
具体语法参考[甘特图语法参考](https://mermaidjs.github.io/)
> ##### 例1:
```gantt
dateFormat YYYY-MM-DD
title 产品计划表
section 初期阶段
明确需求: 2017-03-01, 10d
section 中期阶段
跟进开发: 2017-03-11, 9d
section 后期阶段
抽查测试: 2017-03-20, 9d
```
> ##### 效果:
> ```gantt
dateFormat YYYY-MM-DD
title 产品计划表
section 初期阶段
明确需求: 2017-03-01, 10d
section 中期阶段
跟进开发: 2017-03-11, 9d
section 后期阶段
抽查测试: 2017-03-20, 9d
> ```
> ##### 例2:
```gantt
title 项目开发流程
section 项目确定
需求分析 :a1, 2016-06-22, 3d
可行性报告 :after a1, 5d
概念验证 : 5d
section 项目实施
概要设计 :2016-07-05 , 5d
详细设计 :2016-07-08, 10d
编码 :2016-07-15, 10d
测试 :2016-07-22, 5d
section 发布验收
发布: 2d
验收: 3d
```
> ##### 效果:
>```gantt
title 项目开发流程
section 项目确定
需求分析 :a1, 2016-06-22, 3d
可行性报告 :after a1, 5d
概念验证 : 5d
section 项目实施
概要设计 :2016-07-05 , 5d
详细设计 :2016-07-08, 10d
编码 :2016-07-15, 10d
测试 :2016-07-22, 5d
section 发布验收
发布: 2d
验收: 3d
>```
* * *
[GitHub主页]:https://github.com
[^1]: Markdown是一种纯文本标记语言
[^2]: Hypertext Markup Language超文本标记语言
[1]:https://github.com/MrChenYoung "GitHub地址"
[2]:https://github.com/MrChenYoung "GitHub地址"
[3]:https://upload-images.jianshu.io/upload_images/2421826-b2e860959b39e4a1.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240 "小猫"
[4]:https://upload-images.jianshu.io/upload_images/2421826-b2e860959b39e4a1.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240 "小猫"
[5]: /Users/mrchen/Desktop/%E6%97%B6%E5%BA%8F%E5%9B%BE%E8%AF%AD%E6%B3%95.jpg