Learn Markdown

前言

要想写一篇格式清楚,样式精美的文章,在以前需要先写内容,然后再润色样式。这种方式很大程度上影响内容的输出,而且样式在各平台的不统一。
如何只要关注内容,而不必关注样式,并且样式能在各个平台兼容?markdown是一种不错的选择。熟悉了markdown书写规则之后,就能不被样式束缚,可以只关注于内容,而且现在多个平台上基本都支持md,样式也基本标准统一。所以,我们在输出内容时,也能输出统一标准精美的样式(md的样式基本是统一标准的)。这种的方式非常适合于技术博客。

Markdown 是什么?

Markdown 是一种轻量级标记语言,创始人是约翰・格鲁伯(John Gruber)。它允许人们 “使用易读易写的纯文本格式编写文档,然后转换成有效的 HTML 文档”。
—— 维基百科。

Markdown 简化了 HTML 的语法,使得大多数人都可以轻松地完成文档排版;
Markdown 的基础排版功能,如标题、段落、加重等功能,不要求使用者有其他技能基础;
Markdown 的基础样式功能,如字体、字号、颜色等,需要使用者有 HTML & CSS 基础。

markdown 原理 链接, 链接

我的理解:

  • md 是一种轻量级标记语言,创始人是约翰・格鲁伯(John Gruber)。它允许人们 “使用易读易写的纯文本格式编写文档,然后转换成有效的 HTML 文档”。 .md文件是md标记语言编写的。 语法:有其md特殊的标记(如# * 等),它也支持所有的html标记(即在.md文档中直接使用html的所有标签)。实际上,md的展示过程,是 md处理器/引擎 处理md特殊标记 然后编译转化输出html文档,然后再渲染html进行展示(对于html标记不做处理 原样转化)。 所以一些可以展示md的编辑器/软件 实际上是有md引擎以及html渲染引擎的。

  • Markdown 语法支持嵌入原始的 HTML 标记语言,支持 CSS 样式。

  • 所以你理解html 就能理解md。因为最后渲染成html的。知道html的样式 效果,就能知道md标签的含义和最后效果。 md使得你专注内容,而不是那些样式等。

  • 学习md 既能加深html的理解,以及展示的效果, 还能学到排版 样式 等知识。

  • 如何学习这么多的md规则? 实际上md文档就是为了写文章,文章中主要有什么?你清楚了文章主要有什么,那么就能很快掌握md相应的书写规则。
    你想想文章 都有什么 或 排版都有什么:

    • 结构:文章题目,目录, 各个标题 小标题 。 正文(由段落组成),常用的图表,图片,链接,代码块 等。
    • 样式/格式: 字体,字号,颜色,对齐, 斜体,加粗,下划线,删除线 等等。

    这些都对应着响应的md书写规则。 只要你对文章的结构 排版都清楚,那么学起md就非常得心应手。

markdown 太轻便了,学会了,使用起来非常舒服,优雅。 任何时刻,都可以写(毕竟时纯文本形式)。
学会简单的规则,就能写出很好的文档。 不需要用那些复杂的文本编辑软件等。

文章 排版结构:
1.前面目录。 [TOC]
2.层次 逻辑分清楚。 段落/主题, section,小节。
3.各个段落/主题 之间的关联。
4.字体 颜色 样式。 着重: 标红 放大 加粗 斜体 下划线。  代码块。 表格。 图片插入。分点样式等。
写作有时候 虽然文笔不好,但是 能将逻辑、 结构、步骤弄清楚 也是一篇不错的合格的文章。

创建和查看

创建编辑.md文档。

任何编辑器都可以创建.md文件。 .md文件实际上就是纯文本文件,因此可以用任何编辑器编辑。所以 只要你学会md的书写,那么你就可以何时何地,不受工具限制,进行文章创作。

展示.md的效果。

需要编辑器/软件 1.支持.md的解析,2.以及html的渲染,展示最终效果,否则只能看到纯文本的源文件。

常用的编辑器

用于展示和编辑的编辑器有Typora, vscode(安装相应插件)。

常见的MD书写规则

注意 书写规则中MD标记 前后空格。 如

#无效的标题. 因为和#连在一起。
# 有效的标题。
1.无效的有序列表。 
1. 有效的

文章题目。

这个没什么说的。H1.

文章目录。

  1. [TOC] 自动生成目录。 不过有些md编辑器无法显示。
  2. 手动。 需要手动更新。 不过有些编辑器可以插件生成,比如vscode。
    - [一级标题](#一级标题)
      - [标题 1-1](#二级标题 1-1)
      - [标题 1-2](#二级标题 1-2)
    - [二级标题](#二级标题)
      - [标题 2-1](#二级标题 2-1)
      - [标题 2-2](#二级标题 2-2)
    - [一级标题](#一级标题)
      - [标题 1-1](#二级标题 1-1)
      - [标题 1-2](#二级标题 1-2)
    - [二级标题](#二级标题)
      - [标题 2-1](#二级标题 2-1)
      - [标题 2-2](#二级标题 2-2)
    
    # 一级标题
    一些内容……
    ## 二级标题 1-1
    一些内容……
    ## 二级标题 1-2
    一些内容……
    # 二级标题
    一些内容……
    ## 二级标题 2-1
    一些内容……
    ## 二级标题 2-2
    一些内容……
    

标题

使用 #。对应 html中h1~h6.
标题是组织文章结构的最好方式。
Markdown 的标题定义方式,不用担心标题格式混乱,文章始终保持结构性,作为创作者,只需要关心内容即可。在某些 Markdown 编写工具中,标题也可用于自动生成目录树或大纲。
标题 目录 也是文章的逻辑、 结构、 思维导图。

# 这是一个标题
## 这是一个标题
### 这是一个标题
#### 这是一个标题
##### 这是一个标题
###### 这是一个标题

段落/换行

分段

  1. 用空行。 没有空行,那么都算一个段落中。
  2. 后面加两个空格,再按enter,那么渲染的时候就会换行。 否则计算源文件enter换行,渲染后还是再同一行.(不分段的换行)

分割线

下面是三类分割线

使用「星号」作为分割线

***

使用「减号」作为分割线

---

使用「下划线」作为分割线
___

列表

无序列表, 有序列表。html中的 ul ol

### 无序列表

使用星号生成无序列表

* 项目1
* 项目2
* 项目3

使用加号生成无序列表

+ 项目1
+ 项目2
+ 项目3

使用减号生成无序列表

- 项目1
- 项目2
- 项目3

### 有序列表
使用数字实现有序列表

1. 项目1
2. 项目2
3. 项目3

源码中的数字与渲染后的数字并不一一对应,但可以决定列表的开始序号

例如,让 Markdown 渲染器自动安排序号:

0. 项目1
0. 项目2
0. 项目3

让有序列表以 “2” 开头:

2. 项目1
1. 项目2
0. 项目3

引用

行首加入>

块引用里的标题

多行引用
hello

### 块引用的特殊样式

> #### 块引用里的标题
>
> 块引用里的 **重点文字**
>
> 块引用里的列表
> - 项目1
> - 项目2
> - 项目3
>
> 块引用里的表格
>
> |a|b|
> |---|---|
> |c|d|
>
> 块引用里的分割线
> ___
>

强调

标准的粗斜体
斜体
用粗体包含斜体的粗斜体
用粗体包含斜体的粗斜体

### 强调语法的组合应用

- 默认的粗斜体

  ***标准的粗斜体***

- 用粗体包含斜体

  **_用粗体包含斜体的粗斜体_**

- 用斜体包含粗体的粗斜体

  *__用粗体包含斜体的粗斜体__*

辅助线

这是一条删除线

### 中划线语法

这是一个删除线

~~这是一条删除线~~

当删除线内部紧跟 "空格" 时,删除线效果会失效。

~~有效的删除线~~

~~失效的删除线 ~~

~~ 失效的删除线 ~~

~~ 失效的删除线~~

行内代码 块代码

行内 用 `` 包起来。  

块 用``` 包起来。

超链接

#### 声明超链接

一对中括号就可以将文字转换为超链接,如: [北京](https://),[上海](),[广州](),[深圳]()

图片

![替换文字](图片路径 "标题(可选)")

#### 插入一张图片

图片前的文字。

![](https://tva3.sinaimg.cn/crop.0.0.180.180.180/6d04a77djw1e8qgp5bmzyj2050050aa8.jpg?KID=imgbed,tva&Expires=1588529780&ssig=vNCcwnltm2)

图片后的文字

表格

#### 定义表格

|学号|姓名|
|----|----|
|1|张三|
|2|李四|
|3|王五|

任务列表

在 Markdown 文件中,在 " 无序列表 -,+,* " 后面使用 「中括号 []」 声明复选框。在中括号中写入 x ,便可实现选中效果。

#### 复选框 checkbox

- [ ] Java
- [x] Php

特殊符号

使用转义 * >.
只用特殊的字符遇到\ 才能转义,其他的还是原样输出,如 \x

关于 字体 颜色 字号 对齐 下划线

由于md只关注内容本身,并不关注样式,因此要做这些的话,可以通过html标签去实现。
比如:
红色字体
下划线

我剧中了何厚铧德士古时代感和 i 时代公司丢个合适的个合适的根深蒂固的宿舍大概还是低谷
左对齐
右对齐

更多的

可以参考 慕课网教程
这个教程做的很不错。文章的结构和逻辑 非常清晰明了。(要多学习这种技术文章的技巧,排版,结构,逻辑)