Markdown常用语法

yangzqc
2,761 阅读5分钟

[TOC]

阅读说明

  1. 这篇文章参考了官网以及各路大佬的文章，这里感谢了。
  2. 不同平台解析出来的效果会略有差别，甚至解析不出来或者原样解析。
  3. 内容不断完善更新中.....
  4. 随时欢迎大家对文章中有歧义的地方作出指正。

注意事项

  1. Markdown语法中，所有符号保持在 英文输入法 下编写的好习惯。
  2. Markdown编写的过程中，保持 题目说明 和 语法实现 之间空一行的习惯。
  3. 注意不同符号后面加的内容不同，解析出来的效果不同，比如：代码块和图标的表示。
  4. 注意 倾斜字体 和 符号列表 的写法区别（倾斜字体 * 号后面直接加内容，而符号列表先写 * 号，然后空格，再写符号列表内容）。
  5. Markdown语法中 Tab 和 空格 的关系，有时候不一样，但无非两种情况，要么 1Tab = 2空格，要么 1Tab = 4空格。可以自己先试，看解析如何，最后确定即可。
  6. 在插入表格的语法中，第二行必须要有 | --- | ，否则不能解析处表格。并且表格的列数由 | --- | 的个数决定。
  7. 在插入流程图的语法中，第一行不能缺 graph TD 命令，否则无法正常显示流程图。
  8. 在插入时序图的语法中，第一行不能缺 sequenceDiagram 命令，否则无法正常显示时序图。
  9. 在插入甘特图的语法中，第一行不能缺 gantt 命令，否则无法正常显示甘特图。
  10. 设置之后可以自动根据设置的分级标题来自动生成目录。
  11. 目录的语法格式为：[TOC]

标题

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

引用

    >我是引用
    >>我是引用嵌套
    >>>我比你还嵌套

我是引用

我是引用嵌套

我比你还嵌套

邮箱

    <zq_prog@aliyun.com>

zq_prog@aliyun.com

链接

    [百度](https://www.baidu.com/)

百度

文本相关

    **我是加粗**
    *我是斜体*
    ***我既加粗也倾斜***
    <u>我是下划线</u>
    ~~我是删除线，下面的三个*号表示分割线~~
    ***

我是加粗 我是斜体 我既加粗也倾斜 我是下划线 我是删除线，下面的三个*号表示分割线

列表

    先看数字列表
    1. 我是数字列表一
    2. 我是数字列表二
    
    再看符号列表
    * 我是符号列表一
    * 我是符号列表二
    
    尾看数字列表和符号列表的组合
    1. 我是组合的数字列表一
    2. 我是组合的数字列表二
        * 我是组合的符号列表一
        * 我是组合的符号列表二

先看数字列表

  1. 我是数字列表一
  2. 我是数字列表二

再看符号列表

  • 我是符号列表一
  • 我是符号列表二

尾看数字列表和符号列表的组合

  1. 我是组合的数字列表一
  2. 我是组合的数字列表二
    • 我是组合的符号列表一
    • 我是组合的符号列表二

待办事项

    模块计划
    * [x] 计划一
    * [ ] 计划二
    * [ ] 计划三

模块计划

  • 计划一
  • 计划二
  • 计划三

特殊符号

Markdown语法中，用 \ + 特殊符号，才能真正解析成我们想要的符号

    \\ ———— 反斜线
    \` ———— 反引号
    \* ———— 星号
    \_ ———— 下划线
    \{} ———— 花括号
    \[] ———— 方括号
    \() ———— 括号
    \# ———— 井字号

\ ———— 反斜线 ` ———— 反引号 * ———— 星号 _ ———— 下划线 {} ———— 花括号 [] ———— 方括号 () ———— 括号 # ———— 井字号

代码块

常见支持的语言有

language key
HTTP http
Java java
C++ cpp
C# cs
JavaScript javascript
HTML html
CSS css
JSON json
SCSS scss
TypeScript typescript

语法如下，并且语法高亮显示

    ```key
        代码块
    ```

    ```javascript
        var num = 0;
        for (var i = 0; i < 5; i++) {
            num+=i;
        }
        console.log(num);
    ```

    var num = 0;
    for (var i = 0; i < 5; i++) {
        num+=i;
    }
    console.log(num);

插入链接

    [zq_prog掘金](https://juejin.cn/user/3368559358539614)

zq_prog掘金

插入图片

    ![image](
https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2019/3/10/16967b0668b8ae85~tplv-t2oaga2asx-image.image)

image

插入表格

    | 表头一 | 表头二 | 表头三 | 
    | --- | --- | --- | --- |
    | 内容一 | 内容二 | 内容三 | 内容四 |
    | 内容一 | 内容二 | 内容三 | 内容四 |
表头一 表头二 表头三
内容一 内容二 内容三
内容一 内容二 内容三

插入图表

    1. **目前支持饼状图、折线图、柱状图和条形图，只需将 type 改为对应的pie、line、column 和 bar。**
    2. **默认为柱状图**
    3. **数据和各模块标题中间要空
    
    ```chart
    ,预算,收入,花费,债务
    June,5000,8000,4000,6000
    July,3000,1000,4000,3000
    Aug,5000,7000,6000,3000
    Sep,7000,2000,3000,1000
    Oct,6000,5000,4000,2000
    Nov,4000,3000,5000,
    
    type: pie
    title: 每月收益
    x.title: Amount
    y.title: Month
    y.suffix: $
    ```
  1. 目前支持饼状图、折线图、柱状图和条形图，只需将 type 改为对应的pie、line、column 和 bar。
  2. 默认为柱状图
  3. 数据和各模块标题中间要空一行
    ,预算,收入,花费,债务
    June,5000,8000,4000,6000
    July,3000,1000,4000,3000
    Aug,5000,7000,6000,3000
    Sep,7000,2000,3000,1000
    Oct,6000,5000,4000,2000
    Nov,4000,3000,5000,

    type: pie
    title: 每月收益
    x.title: Amount
    y.title: Month
    y.suffix: $

插入数学公式

    ```math  
        表达式
    ```

    ```math          
        e^{i\pi} + 1 = 0
    ```

e^iπ+1=0

    e^{i\pi} + 1 = 0

插入流程图

    ```mermaid
            graph TD
            A[模块A] -->|A1| B(模块B)
            B --> C{判断条件C}
            C -->|条件C1| D[模块D]
            C -->|条件C2| E[模块E]
            C -->|条件C3| F[模块F]
     ``

    graph TD
    A[模块A] -->|A1| B(模块B)
    B --> C{判断条件C}
    C -->|条件C1| D[模块D]
    C -->|条件C2| E[模块E]
    C -->|条件C3| F[模块F]

插入时序图

    ```mermaid
        sequenceDiagram
        A->>B: 是否已收到消息？
        B-->>A: 已收到消息
    ```

    sequenceDiagram
    A->>B: 是否已收到消息？
    B-->>A: 已收到消息

插入甘特图

    ```mermaid
        gantt
        title 甘特图
        dateFormat YYYY-MM-DD
        section 项目A
        任务1 :a1, 2018-06-06, 30d
        任务2 :after a1 , 20d
        section 项目B
        任务3 :2018-06-12 , 12d
        任务4 : 24d
    ```

    gantt
    title 甘特图
    dateFormat YYYY-MM-DD
    section 项目A
    任务1 :a1, 2018-06-06, 30d
    任务2 :after a1 , 20d
    section 项目B
    任务3 :2018-06-12 , 12d
    任务4 : 24d
avatar
文章
阅读
粉丝