人生苦短,快用 MarkDown

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转义字符 &nbsp;
换行:上一行结尾加两个空格再回车(<br>)。建议少用,可用无序列表代替
连续换行多行:语义性原因不建议这么做,可直接写HTML换行标签<br>

空     格
没 &nbsp;&nbsp;&nbsp;&nbsp;换行
 
段落
 
<!-- 少见情况 -->
 
本行结尾空两格  
回车就会换一行
 
连续换行多行
<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特殊符号如< > &和都会自动转义为&lt; &gt; &amp;
代码块要离上下内容空一行,否则易出问题
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>)

---

  • 前面空一行
  • 本行最少三个-表示水平线,分隔线

转自:https://blog.csdn.net/xun527/article/details/78821095

猜你喜欢

转载自blog.csdn.net/u014209205/article/details/82772392