markdown 换行_Markdown入门:简介、基础语法、扩展语法GFM与排版技巧

1d0ec26c0c7b7918ead9fc0daff8b2cd.png

这是笔者暑假期间的学习笔记,内容主要参考毕小朋的《了不起的Markdown》,希望对初学者有所帮助。

《了不起的Markdown》GitHub 链接:

https://github.com/bxiaopeng/thegreatmarkdown/​github.com

目录

1. Markdown 简介

1.1 Markdown 是什么

1.2 使用 Markdown 的场景、工具和平台

1.3 Markdown 编辑器

2. Markdown 基础语法

2.1 字体

2.1.1 标题

2.1.2 粗体和斜体

2.2 段落与换行

2.2.1 列表

2.2.2 分隔线

2.3 图片

2.4 链接

2.4.1 文字链接

2.4.2 引用链接

2.4.3 网址链接

2.5 行内代码与代码块

2.5.1 行内代码

2.5.2 代码块

2.6 引用

2.7 转义

3. Markdown 扩展语法 GFM

3.1 删除线

3.2 表情符号

3.3 自动链接

3.4 表格

3.5 任务列表

3.6 围栏代码块

3.7 锚点

4. Markdown 排版技巧

4.1 关于空格

4.1.1 需要加空格的情况

4.1.2 不需加空格的情况

4.2 全角和半角

4.3 正确的英文大小写

每部分除了语法介绍外还有简单的示例,方便大家更好地理解。

1. Markdown 简介

1.1 Markdown 是什么

Markdown 设计灵感主要来源于纯文本电子邮件的格式,目标是让人们能够使用易读、易写的纯文本格式编写文档,而且这些文档可以转换为 HTML(Hyper Text Markup Language,超文本标记语言)文档。

简单来说,Markdown 是由一些简单的符号(如*/->[]()#)组成的用于排版的标记语言,其最重要的特点就是可读性强。

Markdown 相当于简化了的 HTML,它只提供用户最常用的语法格式,更易读和易写,用户可以不必关心复杂的 HTML 标签,只专注于写作就行了。

1.2 使用 Markdown 的场景、工具和平台

ce7b292fc5fbd5b635df316031866a4f.png

1.3 Markdown 编辑器

Typora、Visual Studio Code(CS Code)、Gitbook、印象笔记、有道笔记、MWeb、CMD Markdown等。

推荐:Typora、Visual Studio Code

2. Markdown 基础语法

2.1 字体

2.1.1 标题

标题支持使用两种标记:底线(-/=)和 #(建议使用 # 标记标题)

  1. 使用底线的语法
一级标题
=========

二级标题
--------

语法说明:

= 表示一级标题,- 表示二级标题(只支持这两级标题)。底线符号的数量至少为 2 个。

b2287a3b798e749074966a6adf6afedb.png
渲染效果

2. 使用 # 的语法

# + 空格 + 标题内容

语法说明:

# 的个数表示标题的等级,Markdown 中最多只支持六级标题。

# 一级标题
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题

2.1.2 粗体和斜体

粗体:两个 * 或两个 _ 包裹(建议使用 *

斜体:一个 * 或一个 _ 包裹(建议使用 *

语法:

**粗体** 
*斜体*

粗体

斜体

2.2 段落与换行

Markdown 中的段落由一行或多行文本组成,不同的段落之间使用空行来标记。

语法说明如下:

  1. 如果行与行之间没有空行,则会被视为同一段落
  2. 如果行与行之间有空行,则会被视为不同的段落
  3. 空行是指行内什么都没有,或者只有空格和制表符
  4. 如果想在段内换行,则需要再上一行的结尾插入两个以上的空格然后按回车键

换行的建议:

  1. 当超过 80 个字符后进行换行
  2. 在一句话结束( 。或 !或 ?)后换行
  3. 当 URL 较长时换行

2.2.1 列表

有序列表:用数字序号 + 英文句号 + 空格 + 列表内容来标记

无序列表:*/+/- + 空格 + 列表内容来标记(推荐用 -

示例:

##### 有序列表
1. Python
2. R
3. SQL

##### 无序列表
- Python
- R
- SQL

f26b760898758fa23214e1ad540983a8.png
##### 嵌套列表
- Python
    - 数据库编程
        - Python 的 DB-API
            - 模块属性
            - Connection 对象
            - Cursor 对象

##### 有序列表和无序列表互相嵌套
1. Python 文本处理
    - 逗号分割值(CSV)
    - JSON
    - 可标记扩展语言
        1. XML 简介
        2. Python 和 XML
        3. XML 实战

45f60d3dd110eac6717ad8528a8628e3.png

如果一个列表中的每个列表项都只有 1 行,建议列表项之间不要有空行。如果列表项有换行,则建议给无序列表使用 3 个空格,给有序列表使用 2 个空格。

2.2.2 分隔线

在Markdown中,分隔线由 3 个或 3 个以上的 */-/_ 来标记。

##### 下面是分隔线
---
##### 上面是分隔线

9071a32e7ab563b576f44974785bcbeb.png

2.3 图片

插入图片的语法:

```
![图片替代文字](图片地址)
```

说明:

  1. 图片替代文字在图片无法正常显示时会比较有用,正常情况下可以为空
  2. 图片地址可以是本地图片的路径也可以是网络图片的地址
  3. 本地图片支持相对路径和绝对路径两种方式

示例:

![Markdown](https://www.fullstackpython.com/img/logos/markdown.png)

1970a7a100a92218c92f3fb7474f100c.png

2.4 链接

2.4.1 文字链接

文字链接就是把链接地址直接写在文本中。语法是用方括号包裹链接文字,后面紧跟着括号包裹的链接地址。语法如下:

[链接文字](链接地址)

示例:

进入 [Markdown官网](https://daringfireball.net/projects/markdown/)

3c6bcf0fcab53381fb4ee88b4b2bc33e.png

2.4.2 引用链接

引用链接就是把链接地址作为“变量”先在 Markdown 文件的页尾定义好,然后在正文中进行引用。语法如下:

在正文中引用链接标记,可以理解为引用定义好的变量:
[链接文字](链接标记)
在底部定义链接标记,可以理解为定义一个地址变量:
[链接标记]: 链接地址

说明:

  1. 链接标记可以有字母、数字、空格和标点符号
  2. 链接标记不区分大小写
  3. 定义的链接内容可以放在当前文件的任意位置,建议放在页尾
  4. 当链接地址为网络地址时要以 http / https 开头,否则会被识别为本地地址

示例:

在日常工作中,我们经常使用的网址有 [Google]、[Github] 和 [Stack Overflow]
[Google]: https://www.google.com/
[GitHub]: https://github.com/
[Stack Overflow]: https://stackoverflow.com/?utm_source=rss&utm_medium=rss

f868ba3b482d261fdd46a53f35f7bdaa.png

2.4.3 网址链接

在 Markdown 中,将网络地址或邮箱地址使用 <> 包裹起来会被自动转换为超链接。语法如下:

<URL或邮箱地址>

示例:

GitHub官网:<https://github.com/>

9a191e99b913a94136f682c760db2c82.png

2.5 行内代码与代码块

2.5.1 行内代码

在 Markdown 中,行内代码引用使用 ` 包裹。语法如下:

`代码`

示例:

使用 cd .. 命令切换目录

2.5.2 代码块

在 Markdown 中,代码块以 Tab 键或 4 个空格开头。语法如下:

    def print_hello_world():
        print('Hello, world!')

如果代码超过一行,建议使用围栏代码块(扩展语法),并显式地声明语言,方便阅读,并且可以显示语法高亮。

示例:

```python
def print_hello_world():
    print('Hello, world!')
```

d4071b58ec01668631405be33dd9fe35.png
常用编程语言及key的对应表

很多 Shell 命令都要粘贴到终端中去执行,因此最好避免在 Shell 命令中使用任何换行操作。可以在行尾使用一个 ,这样既能避免命令换行,又能提高源码的可读性。

示例:

```shell
jvs run --test=tests/home/test_login.py::TestLogin::test_login_failed--env=online 
--username="123456" --password="123456" --url="百度一下,你就知道"
```

建议在有输出内容的 Shell 命令前加上 $,不要在没有输出内容的 Shell 命令前加 $

2.6 引用

在 Markdown 中,引用由 > + 引用内容来标记。如下所示:

> 引用内容

说明:

  1. 多行引用也可以在每一行的开头都插入 >
  2. 在引用中可以嵌套引用
  3. 在引用中可以使用其他的 Markdown 语法
  4. 段落与换行的格式在引用中也是适用的

示例:

> I keep saying that the sexy job in the next 10 years will be statisticians. And I'm not kidding.
> ——Hal Varian, Chief Economist at Google, 2009
I keep saying that the sexy job in the next 10 years will be statisticians. And I'm not kidding.
——Hal Varian, Chief Economist at Google, 2009

2.7 转义

当我们想在 Markdown 中插入一些标记符号,但又不想让这些符号被渲染时,可以使用 进行转义。语法如下:

特殊符号

可被转义的特殊符号有:

反斜线、` 反引号、* 星号、_ 底线、{} 花括号、[] 方括号、() 小括号、# 井号、+ 加号、- 减号、. 英文句号、! 感叹号

3. Markdown 扩展语法 GFM

GitHub Flavored Markdown(简称 GFM)是目前最流行的 Markdown 扩展语法,它提供了包括表格、任务列表、删除线、围栏代码、Emoji 等在内的标记语法。

3.1 删除线

语法如下:

~~被删除的文字~~

示例:

~~这是一条删除线~~

fcc6ac22913d816eaf799cbd83ee57d4.png

3.2 表情符号

语法如下:

:表情代码:

示例:

544984d96b1e0400b71c5765e6c1ff20.png

更多的表情符号可参考

Emoji cheat sheet for GitHub, Basecamp and other services​www.webpagefx.com

下面是节选示例(这些 Emoji 是不是很熟悉hhh)

a0d2b469e7c88ceb8a29d63720a4abf8.png

17ea93b2f6f890ec91293152f2622aa1.png

3054a9408cd22f37fd4cc630071ee7c5.png

6016b3e1053af5e1e1816c1388148207.png

f46e73139fb1133a6c68e3d8ed0cf1a1.png

3.3 自动链接

在标准语法中,由 <> 包裹的 URL 地址被自动识别并解析为超链接,使用 GFM 扩展语法则可以不使用 <> 包裹。

注意:自动链接只识别以 www 或 http:// 开头的 URL 地址

如果不想使用自动链接,也可以使用 ` 包裹 URL 地址。

示例:

`www.baidu.com`

3.4 表格

语法如下:

| 表头1 | 表头2 | 表头3 |
| ---- | ---- | ---- |
| 内容1 | 内容2 | 内容3 |
| 内容1 | 内容2 | 内容3 |

说明:

  1. 单元格使用 | 来分隔,为了阅读更清晰,建议最前和最后都使用 |
  2. 单元格和 | 之间的空格会被移除
  3. 表头与其他行使用 --- 来分隔
  4. 表格对齐格式如下
  • 左对齐(默认): :----
  • 右对齐: ----:
  • 居中对齐: :----:

5. 块级元素(代码区块、引用区块)不能插入表格中

示例:

| Python库 | 官方网站 |
| -- | -- |
| numpy | http://numpy.org/ |
| pandas | https://pandas.pydata.org/ |
| matplotlib | https://matplotlib.org/ |
| scipy | https://www.scipy.org/ |
| scikit-learn | https://scikit-learn.org/stable/ |
| statsmodels | https://www.statsmodels.org/stable/index.html |

7c1efc950472bee87c2568d743161b4a.png

建议:

  1. 表格的前、后各空一行
  2. 在每一行最前和最后都使用 | ,每一行中的 | 尽量对齐
  3. 不要使用庞大复杂的表格,那样会难以维护和阅读

3.5 任务列表

语法如下:

- [ ] 未勾选
- [x] 已勾选

说明:

  1. 任务列表以 - + 空格开头,由[ + 空格 / x + ]组成
  2. x 可以小写也可以大写,有些编辑器可能不支持大写,所以推荐使用小写的 x

示例:

今日学习任务:
- [x] 学习Markdown
- [x] 学习Python
- [ ] 学习SQL

eeb90170be5d0f60b108988cab276892.png

3.6 围栏代码块

在基础语法中,代码块使用 Tab 键或 4 个空格开头;在拓展语法中,围栏代码块使用连续 3 个 ` 或 3 个 ~ 包裹,同时支持语法高亮,可读性和可维护性更强。语法如下:

```
代码片段
```

3.7 锚点

锚点,也称为书签,用来标记文档中的特定位置。使用锚点可以跳转到当前文档或其他文档中指定的标记位置。

Markdown 会被渲染成 HTML 页面,在 HTML 页面中可以通过锚点实现跳转。GitHub、GitBook 项目文档中的目录也是通过锚点实现跳转的。

语法如下:

[锚点描述](#锚点名)

说明:

  1. 锚点名建议使用字母和数字,有些编辑器不支持中文
  2. 锚点名区分英文大小写
  3. 锚点名中不能含有空格,也不能含有特殊字符

GFM官方文档:GitHub Flavored Markdown Spec

4. Markdown 排版技巧

4.1 关于空格

建议中文和英文之间加空格,中文/英文和数字之间也要加空格。不过有些编辑器和输入法(如百度输入法)会自动添加空隙,我们就没必要手动添加了。

4.1.1 需要加空格的情况

  • 英文标点符号(如 , . ; ?)与后面的字符之间需要加空格,与前面的字符之间不需要加空格

The ability to take data—to be able to understand it, to process it, to extract value from it, to visualize it, to communicate it—that's going to be a hugely important skill in the next decades.

  • 在中文、英文中使用 >(半角)标识路径时,两边都需要加空格

File > Settings > Project: Name > Project Interpreter

4.1.2 不需加空格的情况

  • 中文标点符号和数字、中文、英文之间不需要添加空格
  • 数字和百分号之间不需要添加空格
  • 数字和单位符号之间不需要添加空格
  • 英文和数字组合成的名字之间不需要添加空格
  • 当 /(半角)表示“或”、“路径”时,与前后的字符之间均不加空格
  • 货币符号后不加空格
  • 负号后不加空格

4.2 全角和半角

全角:中文标点符号是全角,占两个字节。如:,。;:?!

半角:英文标点符号和数字是半角,占1个字节。如:, . ; : ? ! #

中文排版中使用全角符号,英文排版中使用半角符号。

4.3 正确的英文大小写

macOS、iOS、GitHub

参考资料:

Mastering Markdown​guides.github.com
1019549d773f35cefea0dbfaaf5b2857.png
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值