Markdown语法整理

大部分内容来自《https://www.runoob.com/markdown/md-advance.html》

目录

@[TOC](这里写目录标题)

显示效果:

标题

  使用 # 号可表示 1-6 级标题,一级标题对应一个 # 号,二级标题对应两个 # 号,以此类推。

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

显示效果:
在这里插入图片描述

文本、段落格式

斜体、粗体

*斜体文本*
_斜体文本_
**粗体文本**
__粗体文本__
***粗斜体文本***
___粗斜体文本___

显示效果:
斜体文本
斜体文本
粗体文本
粗体文本
粗斜体文本
粗斜体文本

标记、删除线、下划线、引用

==标记文本==
~~删除线~~
<u>带下划线文本</u>
> 引用文本

显示效果:
标记文本
删除线
带下划线文本

引用文本

上标、下标

H~2~O is是液体。
2^10^ 运算结果是 1024。

H2O is是液体。
210 运算结果是 1024。

也可以:

H<sub>2</sub>O  CO<sub>2</sub>
爆米<sup>TM</sup>

效果:
H2O CO2
爆米TM

注脚

第一个具有注脚的文本。[^1]
第二个具有注脚的文本。[^2]
[^1]: 第一个注脚的解释
[^2]: 第二个注脚的解释

显示效果(注脚的解释会自动放在文末):
第一个具有注脚的文本。1
第二个具有注脚的文本。2

分隔线

  可以在一行中用三个以上的星号、减号、底线来建立一个分隔线,行内不能有其他东西。也可以在星号或是减号中间插入空格。下面每种写法都可以建立分隔线:

***

* * *

*****

- - -

----------

显示效果:






段首小圆点

首先 · 这个符号,可以用 “-”和“+”这两个符号

+ 切换到root账户命令
su root
+ 查看网络设备列表命令
nmcli dev

显示效果:

  • 切换到root账户命令
    su root
  • 查看网络设备列表命令
    nmcli dev

还可以使用

<li>开启wifi命令

nmcli r wifi on

显示效果:

  • 开启wifi命令
  • nmcli r wifi on

    链接

    链接: [link](https://www.csdn.net/).
    
    图片: ![Alt](https://i-blog.csdnimg.cn/blog_migrate/2c5626d1121945cb84be5bc1cdd2de45.gif)
    
    带尺寸的图片: ![Alt](https://i-blog.csdnimg.cn/blog_migrate/2c5626d1121945cb84be5bc1cdd2de45.gif =30x30)
    
    居中的图片: ![Alt](https://i-blog.csdnimg.cn/blog_migrate/2c5626d1121945cb84be5bc1cdd2de45.gif#pic_center)
    
    居中并且带尺寸的图片: ![Alt](https://i-blog.csdnimg.cn/blog_migrate/2c5626d1121945cb84be5bc1cdd2de45.gif#pic_center =30x30)
    

    显示效果:
    链接: link.

    图片:
    Alt

    带尺寸的图片:
    Alt

    居中的图片:
    Alt

    居中并且带尺寸的图片:
    Alt

    代码片

      如果是段落上的一个函数或片段的代码可以用反引号把它包起来(`),例如:

    `printf()` 函数
    

    显示结果如下:
    printf() 函数

      也可以用 ```包裹一段代码,并指定一种语言(也可以不指定):

    ```
    // A code block
    int foo = ‘bar’;
    ```

    ```c
    // A code block
    int foo = ‘bar’;
    ```

    ```javascript
    // An highlighted block
    var foo = ‘bar’;
    ```
    显示效果:

    // A code block
    int foo = 'bar';
    
    // A code block
    int foo = 'bar';
    
    // An highlighted block
    var foo = 'bar';
    

    列表

    Markdown 支持有序列表和无序列表。
    无序列表使用星号(*)、加号(+)或是减号(-)作为列表标记,这些标记后面要添加一个空格,然后再填写内容:

    * 第一项
    * 第二项
    * 第三项
    
    - 项目
      * 项目
        + 项目
    

    显示效果:

    • 第一项

    • 第二项

    • 第三项

    • 项目

      • 项目
        • 项目

    有序列表使用数字并加上 . 号来表示,如:

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

    列表嵌套只需在子列表中的选项前面添加四个空格即可:

    1. 第一项:
        - 第一项嵌套的第一个元素
        - 第一项嵌套的第二个元素
    2. 第二项:
        - 第二项嵌套的第一个元素
        - 第二项嵌套的第二个元素
    

    显示效果:

    1. 第一项:
      • 第一项嵌套的第一个元素
      • 第一项嵌套的第二个元素
    2. 第二项:
      • 第二项嵌套的第一个元素
      • 第二项嵌套的第二个元素

    表格

    基本

    制作表格使用 | 来分隔不同的单元格,使用 - 来分隔表头和其他行。语法格式如下:

    |  表头   | 表头  |
    |  ----  | ----  |
    | 单元格  | 单元格 |
    | 单元格  | 单元格 |
    

    以上代码显示结果如下:

    表头表头
    单元格单元格
    单元格单元格

    对齐方式

    我们可以设置表格的对齐方式:

    -: 设置内容和标题栏居右对齐。
    :- 设置内容和标题栏居左对齐。
    :-: 设置内容和标题栏居中对齐。
    实例如下:

    | 左对齐 | 右对齐 | 居中对齐 |
    | :-----| ----: | :----: |
    | 单元格 | 单元格 | 单元格 |
    | 单元格 | 单元格 | 单元格 |
    

    显示效果:

    左对齐右对齐居中对齐
    单元格单元格单元格
    单元格单元格单元格

    表格内换行

    |姓名|爱好|
    --|--|
    张三|足球<br>篮球
    李四|羽毛球<br>乒乓球
    

    显示效果:

    姓名爱好
    张三足球
    篮球
    李四羽毛球
    乒乓球

    合并行、合并列

    参考这儿:https://blog.csdn.net/wowocpp/article/details/80909693

    <table>
        <tr>
            <td>列一</td> 
            <td>列一</td> 
       </tr>
        <tr>
            <td colspan="2">合并行</td>    
        </tr>
        <tr>
            <td colspan="2">合并行</td>    
        </tr>
    </table>
    

    显示效果:

    列一列一
    合并行
    合并行
    <table>
        <tr>
            <td>列一</td> 
            <td>列二</td> 
       </tr>
        <tr>
            <td rowspan="2">合并列</td>    
            <td >行二列二</td>  
        </tr>
        <tr>
            <td >行三列二</td>  
        </tr>
    </table>
    

    显示效果:

    列一列二
    合并列行二列二
    行三列二

    Markdown 高级技巧

    支持的 HTML 元素

    不在 Markdown 涵盖范围之内的标签,都可以直接在文档里面用 HTML 撰写。

    目前支持的 HTML 元素有:<kbd> <b> <i> <em> <sup> <sub> <br>等 ,如:
    使用 <kbd>Ctrl</kbd>+<kbd>Alt</kbd>+<kbd>Del</kbd> 重启电脑
    

    显示效果:
    使用 Ctrl+Alt+Del 重启电脑

    转义

    Markdown 使用了很多特殊符号来表示特定的意义,如果需要显示特定的符号则需要使用转义字符,Markdown 使用反斜杠转义特殊字符:

    **文本加粗** 
    \*\* 正常显示星号 \*\*
    

    显示效果:
    文本加粗
    ** 正常显示星号 **

    公式

    当你需要在编辑器中插入数学公式时,可以使用两个美元符 $$ 包裹 TeX 或 LaTeX 格式的数学公式来实现。提交后,问答和文章页会根据需要加载 Mathjax 对数学公式进行渲染。参考文档,如:

    $\Gamma(n) = (n-1)!\quad\forall
    n\in\mathbb N$ 
    
    $$
    \Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.
    $$
    

    输出结果为:

    Γ ( n ) = ( n − 1 ) ! ∀ n ∈ N \Gamma(n) = (n-1)!\quad\forall n\in\mathbb N Γ(n)=(n1)!nN

    Γ ( z ) = ∫ 0 ∞ t z − 1 e − t d t   . \Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,. Γ(z)=0tz1etdt.

    typora 画流程图、时序图(顺序图)、甘特图

    复制以下代码使用 typora 的源码模式粘贴到编辑器中查看效果:
    在这里插入图片描述
    以下几个实例效果图如下:

    1、横向流程图源码格式:

    ```mermaid
    graph LR
    A[方形] -->B(圆角)
    B --> C{条件a}
    C -->|a=1| D[结果1]
    C -->|a=2| E[结果2]
    F[横向流程图]
    ```
    效果图如下:

    a=1
    a=2
    方形
    圆角
    条件a
    结果1
    结果2
    横向流程图

    2、竖向流程图源码格式:

    ```mermaid
    graph TD
    A[方形] --> B(圆角)
    B --> C{条件a}
    C --> |a=1| D[结果1]
    C --> |a=2| E[结果2]
    F[竖向流程图]
    ```
    效果图如下:

    a=1
    a=2
    方形
    圆角
    条件a
    结果1
    结果2
    竖向流程图

    3、标准流程图源码格式:

    ```mermaid
    flowchat
    st=>start: 开始框
    op=>operation: 处理框
    cond=>condition: 判断框(是或否?)
    sub1=>subroutine: 子流程
    io=>inputoutput: 输入输出框
    e=>end: 结束框
    st->op->cond
    cond(yes)->io->e
    cond(no)->sub1(right)->op
    ```
    效果图如下:

    Created with Raphaël 2.3.0 开始框 处理框 判断框(是或否?) 输入输出框 结束框 子流程 yes no

    4、标准流程图源码格式(横向):

    ```mermaid
    flowchat
    st=>start: 开始框
    op=>operation: 处理框
    cond=>condition: 判断框(是或否?)
    sub1=>subroutine: 子流程
    io=>inputoutput: 输入输出框
    e=>end: 结束框
    st(right)->op(right)->cond
    cond(yes)->io(bottom)->e
    cond(no)->sub1(right)->op
    ```
    效果图如下:

    Created with Raphaël 2.3.0 开始框 处理框 判断框(是或否?) 输入输出框 结束框 子流程 yes no

    5、UML时序图源码样例:

    ```mermaid
    sequenceDiagram
    对象A->>对象B: 对象B你好吗?(请求)
    Note right of 对象B: 对象B的描述
    Note left of 对象A: 对象A的描述(提示)
    对象B–>>对象A: 我很好(响应)
    对象A->>对象B: 你真的好吗?
    ```
    效果图如下:

    对象A 对象B 对象B你好吗?(请求) 对象B的描述 对象A的描述(提示) 我很好(响应) 你真的好吗? 对象A 对象B 标题:复杂使用

    6、UML时序图源码复杂样例:

    ```mermaid
    sequenceDiagram
    Title: 标题:复杂使用
    对象A->>对象B: 对象B你好吗?(请求)
    Note right of 对象B: 对象B的描述
    Note left of 对象A: 对象A的描述(提示)
    对象B–>>对象A: 我很好(响应)
    对象B->>小三: 你好吗
    小三–>>对象A: 对象B找我了
    对象A->>对象B: 你真的好吗?
    Note over 小三,对象B: 我们是朋友
    participant C
    Note right of C: 没人陪我玩
    ```
    效果图如下:

    对象A 对象B 小三 C 对象B你好吗?(请求) 对象B的描述 对象A的描述(提示) 我很好(响应) 你好吗 对象B找我了 你真的好吗? 我们是朋友 没人陪我玩 对象A 对象B 小三 C 标题:复杂使用

    7、UML标准时序图样例:

    ```mermaid
    %% 时序图例子,-> 直线,–>虚线,->>实线箭头
    sequenceDiagram
    participant 张三
    participant 李四
    张三->王五: 王五你好吗?
    loop 健康检查
    王五->王五: 与疾病战斗
    end
    Note right of 王五: 合理 食物
    看医生…
    李四–>>张三: 很好!
    王五->李四: 你怎么样?
    李四–>王五: 很好!
    ```
    效果图如下:

    张三 李四 王五 王五你好吗? 与疾病战斗 loop [健康检查] 合理 食物 看医生... 很好! 你怎么样? 很好! 张三 李四 王五 标题:复杂使用

    8、甘特图样例:

    参考文档
    ```mermaid
    gantt
    dateFormat YYYY-MM-DD
    title Adding GANTT diagram functionality to mermaid
    section 现有任务
    已完成 :done, des1, 2014-01-06,2014-01-08
    进行中 :active, des2, 2014-01-09, 3d
    计划中 : des3, after des2, 5d
    ```
    效果图如下:

    Mon 06 Mon 13 已完成 进行中 计划中 现有任务 Adding GANTT diagram functionality to mermaid

    1. 第一个注脚的解释 ↩︎

    2. 第二个注脚的解释 ↩︎

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

【ql君】qlexcel

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值