Markdown 入门一览

2023-10-16 12:22:52

菜鸟必备网站: 菜鸟教程 转载整理成文
markdown环境:vscode + Markdown Preview Enhanced + Markdown PDF
vscode：https://code.visualstudio.com/

Markdown Preview Enhanced: https://marketplace.visualstudio.com/items?itemName=shd101wyy.markdown-preview-enhanced
Ctrl+P打开vscode命令行,输入：>Markdown: Open Preview to the Side打开vscode的markdown实时预览

Markdown PDF : https://marketplace.visualstudio.com/items?itemName=yzane.markdown-pdf
markdown文件转pdf文件。

标题有两种格式
1.使用=和-标记一级标题和二级标题

展示一级标题

展示二级标题

2.使用#表示1-6级标题

一级标题

二级标题

三级标题

四级标题

五级标题
六级标题

段落标记

段落换行是行末尾两个以上的空格加回车

字体

斜体文本
斜体文本
粗体文本
粗体文本
粗斜体文本
粗斜体文本

分割线

在一行中用三个以上的星号、减号、底线来建立一个分割线,行内不能有其他东西。可以在星号或者减号间插入空格

删除线

GOOLE.COM

下划线

带下划线文字

脚注

创建脚注格式类似这样[1].

列表

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

  • 第一项
  • 第二项
  • 第一项
  • 第二项
  • 第一项
  • 第二项

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

  1. 第一项
  2. 第二项

列内嵌套

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

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

区块

markdown 区块引用时在段落开头使用>符号，然后紧跟一个空格符号:

区块引用
区块2
嵌套区块,一个>符号时最外层,两个>符号是第一层嵌套,以此类推:

最外层

第一层嵌套

第二层嵌套

区块中使用列表:

区块中使用列表

  1. 第一项
  2. 第二项
  • 第一项
  • 第二项
  • 第三项

列表中使用区块：
在列表项目内放进区块,需要在>符号前添加四个空格的缩进

  • 第一项

    第一节
    第二节

  • 第二项

markdown 代码

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

代码区块：
使用三个反引号(```)将代码块包含起来.

    #include ""

markdown 链接

链接使用方法如下:
链接名称
或者
<链接地址>
例如: 这是官网链接 runoob官网
或者:https://www.runoob.com/
高级链接
可以通过变量来设置一个链接,变量复制在文档末尾进行:
这个链接用 runoob 作为网址变量官网
然后再文档的结尾变量赋值

markdown 图片

图片语法格式如下：
Markdown 入门一览
Markdown 入门一览

  • 开头一个感叹号
  • 接着一个方括号,里面放图片的替代文字
  • 接近一个普通括号，里面放上图片的网址,最后还可以用引号包住并加上选择性的'title' 属性的文字。

Markdown 入门一览
对图片网址使用变量
这个链接用 1 作为网址变量 RUNOOB.
然后在文档的结尾为变量赋值(网址)

markdown 表格

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

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

对齐方式

  • -:设置内容和标题栏居右对齐.
  • :-设置内容和标题栏居左对齐.
  • :-:设置内容和标题栏居中对齐.
左对齐 右对齐 居中对齐
单 单 单
单 单 单

高级技巧

  • 支持的HTML元素
    不在 Markdown 涵盖范围之内的标签，都可以直接在文档里面用 HTML 撰写。目前支持的 HTML 元素有：<kbd> <b> <i> <em> <sup> <sub> <br>等，
    如: 使用 Ctrl+Alt+Del 重启电脑.

  • 转义
    Markdown 使用了很多特殊符号来表示特定的意义，如果需要显示特定的符号则需要使用转义字符，Markdown 使用反斜杠转义特殊字符. 例如：
    文本加粗
    ** 文本加粗 **

  • Markdown 支持以下这些符号前面加上反斜杠来帮助插入普通的符号：

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

  • 公式
    Markdown Preview Enhanced 使用 KaTeX 或者 MathJax 来渲染数学表达式。
    KaTeX 拥有比 MathJax 更快的性能，但是它却少了很多 MathJax 拥有的特性。你可以查看 KaTeX supported functions/symbols 来了解 KaTeX 支持那些符号和函数。
    默认下的分隔符：

    • $...$ 或者 (...) 中的数学表达式将会在行内显示。
    • $$...$$ 或者 [...] 或者 ```math 中的数学表达式将会在块内显示。

    $f(x) = sin(x) + 12 $
    $$\sum_{n=1}^{100} n $$
    $$
    \begin{Bmatrix}
    a & b \
    c & d
    \end{Bmatrix}
    $$
    $$
    \begin{CD}
    A @>a>> B \
    @VbVV @AAcA \
    C @= D
    \end{CD}
    $$

  • 流程图
    在 Markdown 中，定义一个 Markdown流程图 大致分为两段，第一段是定义元素，第二段是定义元素之间的走向。
    Markdown流程图语法:

定义元素:
tag=>type: content:>url
tag: 元素名字。
type： 是这个元素的类型。

  1. start ： 开始
  2. end ： 结束
  3. operation ： 操作
  4. subroutine ： 子程序
  5. condition ： 条件
  6. inputoutput： 输入或产出

连接元素：
c2(yes)->io->e
c2(no)->op2->e
用 -> 来连接两个元素。需要注意的是 condition 类型，有 yes 和 no 两个分支。

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

  1. 横向流程图源码格式：
    graph LR A[方形] -->B(圆角) B --> C{条件a} C -->|a=1| D[结果1] C -->|a=2| E[结果2] F[横向流程图]
  2. 竖向流程图源码格式：
    graph TD A[方形] --> B(圆角) B --> C{条件a} C --> |a=1| D[结果1] C --> |a=2| E[结果2] F[竖向流程图]
  3. 标准流程图源码格式： 
    st=>start: 开始框
op=>operation: 处理框
cond=>condition: 判断框(是或否?)
sub1=>subroutine: 子流程
io=>inputoutput: 输入输出框
e=>end: 结束框
st->op->cond
cond(yes)->io->e
cond(no)->sub1(right)->op
  4. 标准流程图源码格式（横向）： 
    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
  5. UML时序图源码样例： 
    对象A->对象B: 对象B你好吗?（请求）
Note right of 对象B: 对象B的描述
Note left of 对象A: 对象A的描述(提示)
对象B-->对象A: 我很好(响应)
对象A->对象B: 你真的好吗？
  6. UML时序图源码复杂样例： 
    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: 没人陪我玩
  7. UML标准时序图样例：
    gantt dateFormat YYYY-MM-DD title 软件开发甘特图 section 设计 需求 :done, des1, 2014-01-06,2014-01-08 原型 :active, des2, 2014-01-09, 3d UI设计 : des3, after des2, 5d 未来任务 : des4, after des3, 5d section 开发 学习准备理解需求 :crit, done, 2014-01-06,24h 设计框架 :crit, done, after des2, 2d 开发 :crit, active, 3d 未来任务 :crit, 5d 耍 :2d section 测试 功能测试 :active, a1, after des3, 3d 压力测试 :after a1 , 20h 测试报告 : 48h
  8. 甘特图样例：
    gantt dateFormat YYYY-MM-DD title 软件开发甘特图 section 设计 需求 :done, des1, >2014-01-06,2014-01-08 原型 :active, des2, >2014-01-09, 3d UI设计 : des3, >after des2, 5d 未来任务 : des4, after >des3, 5d section 开发 学习准备理解需求 :crit, >done, 2014-01-06,24h 设计框架 :crit, >done, after des2, 2d 开发 :crit, >active, 3d 未来任务 :crit, 5d 耍 :2d section 测试 功能测试 :active, >a1, after des3, 3d 压力测试 :after >a1 , 20h 测试报告 : 48h

  1. 2022年2月25日. ↩︎

上一篇：GlassFish 任意文件读取漏洞


下一篇：docker基础