Markdown 简介
Markdown 是一种文本标记语言,用于快速文档排版
Markdown 文件为纯文本文件,后缀名为 .md
Markdown 介于Word 和HTML 之间
比起Word,Markdown 是纯文本,排版文档轻量、方便、快速。
比起HTML,Markdown 简单直观,易读、易写、易修改
Markdown 优点
简单、流行、B格高且使用广泛,排版功能足够使用(不足之处可用HTML、CSS弥补)
广泛用于用于办公、文字工作者、程序员等人员日常文档的写作排版
Markdown 缺点
太简单,很多复杂的专业排版样式功能无法实现,只适用于要求不高的文字排版场合(办公、技术文档等)
Markdown 编辑器
任意文本编辑器
专业Markdown编辑器:支持Markdown文档排版后预览,适合文字工作者
- MAC:mou,macdown
- Windows:MarkdownPad
自带预览功能的专业代码编辑器:适合编程、分析等理工类应用
- VSCode 原生支持预览
- Atom 原生支持预览,并可将md文件另存为HTML文件
- Jupyter Notebook 科学工作者和程序员用交互式笔记本,网页版,可用于数据分析、教学、演讲等
Markdown 预览
- Atom:预览快捷键:
- Ctrl+Shift+M
- 或:Ctrl+Shift+P - 命令窗口输入 markdown ,回车
- VSCode:md文件右上方-打开侧边栏预览
Markdown 语法
Markdown 有很多扩展方言,这里使用GFM(Github Flavored Markdown)
如何速成Markdown?
一份Markdown格式的文件,
应该要能以纯文字形式直接发表,
并且一眼看过去不存在任何标记用的标签或格式指令。
- John Gruber
不要机械记忆Markdown标记,如果由我发明一种格式标记语言,写文章时候如何表示标题、段落、列表,你就知道Markdown是怎么发明出来的了。
Markdown基本语法:
1:标题(# h1-h6)
2:空格、段落和换行(<p><br>)
3:超链接([]() <a>)
4:图片(![]() <img>)和公式
5:列表(<ul><ol><li>)
6:代码块(``` <pre>)
7:着重、强调(** <em><strong>)
8:表格(-|-|- <table>)
9:转义字符(\)
10:分隔线(--- <hr>)
1:标题(# h1-h6)
标题(一个# 代表最大一级标题,六个# 最小的)
# 一级标题
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题
一级标题
二级标题
三级标题
四级标题
五级标题
六级标题
2:空格、段落和换行(<p><br>)
空格:直接在编辑器空格或换行,md都只显示为一个空格
段落:回车两次,编辑器换两行,显示为段落(p标签)
少见情况:
多个空格:语义性原因不建议这么做,可直接写HTML转义字符
换行:上一行结尾加两个空格再回车(<br>)。建议少用,可用无序列表代替
连续换行多行:语义性原因不建议这么做,可直接写HTML换行标签<br>
空 格
没 换行
段落
<!-- 少见情况 -->
本行结尾空两格
回车就会换一行
连续换行多行
<br><br><br>
换行结束
空 格没 换行
段落
本行结尾空两格
回车就会换一行
连续换行多行
换行结束
3:超链接([]() <a>)
3.1:直接写链接地址:http://www.aaa.com/ (VSCode不支持)
3.2:[超链接](http://www.aaa.com/)
3.3:[本页面锚点](#abc)
<div id="abc">点击跳转到本页面锚点位置,多用于文档目录</div>
4:图片(![]() <img>)和公式
图片只比超链接前面多个 !
图片路径,相对链接、绝对链接均可
复杂的写法,例如 图片加超链接、图片设宽高 等,建议用HTML或CSS实现
![图片描述](images/markdown.png)
URL地址中带括号的图片,一般是公式,
图片调用和URL链接隔行书写,
一行调用(描述可以不写),
一行定义图片URL地址(括号内名字或数字对应)。
![][gs]
[gs]: http://latex.codecogs.com/gif.latex?\prod%20\(n_{i}\)+1
5:列表(<ul><ol><li>)
* 无序列表1
* 无序列表2
* 无序列表3
* 无序列表4
* 无序列表5
1. 有序列表1
1. 有序列表2
1. 有序列表3
1. 有序列表4
1. 有序列表5
无序列表
无序列表1
无序列表2
无序列表3
无序列表4
无序列表5
有序列表
有序列表1
有序列表2
有序列表3
有序列表4
有序列表5
6:代码块(``` <pre>)
` 反引号
将编辑器内程序代码原格式显示
内部的HTML特殊符号如< > &和都会自动转义为< > &
代码块要离上下内容空一行,否则易出问题
1:行内代码块,一个反引号,HTML转义为<code>包裹区块,保留布局
这是`<strong>行内代码块</strong>`都在一行内
效果:这是<strong>行内代码块</strong>都在一行内
2:块级代码块,三个反引号包含,```,HTML转义为<pre><code>包裹区块,保留布局
```
<div>
这是块级代码块
</div>
```
效果:
<div>
这是块级代码块
</div>
如要带代码高亮效果,3个反引号开始处加上编程语言名
```html
<div>
这是块级代码块
</div>
```
效果:
<div>
这是块级代码块
</div>
如要显示一个反引号或者<pre>标签,用两个反引号包裹文档 ``
在这个``文本中夹杂一个`反引号如何显示``?
效果:在这个文本中夹杂一个`反引号如何显示?
如要显示3个反引号,用<pre>标签标签包裹文档
<pre>
```javascript
function aaa(){
var a = 1;
}
```
</pre>
效果:
```javascript
function aaa(){
var a = 1;
}
```
7:着重、强调(** <em><strong>)
着重 斜体 em *着重 斜体 em*
强调 粗体 strong **强调 粗体 strong**
8:表格(-|-|- <table>)
默认左对齐
表头1 | 表头2 | 表头3
------|------|------
行1列1 | 行1列2 | 行1列3
行2列1 | 行2列2 | 行2列3
行3列1 | 行3列2 | 行3列3
表头1 表头2 表头3
行1列1 行1列2 行1列3
行2列1 行2列2 行2列3
行3列1 行3列2 行3列3
9:转义字符(\)
\ 反斜杠
想在页面显示md标记,
或者你不小心写了其他重复md标记,例如:
### 标题
__也是着重标记__
1986. 数字+点,被转成有序列表
1986. 数字+点,被转成有序列表
标题
也是着重标记
数字+点,被转成有序列表
数字+点,被转成有序列表
反斜杠转义
\### 标题
\__也是着重标记__
1986\. 数字+点,被转成有序列表
1986\. 数字+点,被转成有序列表
### 标题
_也是着重标记_
1986. 数字+点,被转成有序列表1986. 数字+点,被转成有序列表
10:分隔线(--- <hr>)
---
- 前面空一行
- 本行最少三个-表示水平线,分隔线