热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

【Markdown】高级应用技巧与实践

注:写博客或者项目的README文档经常用到markdown语法,所以markdown的语法做了一个总结,本文是基于【markdown】基

注:写博客或者项目的 README 文档经常用到 markdown 语法,所以markdown的语法做了一个总结,本文是基于 【markdown】基本语法的进阶语法。


markdown高阶语法

    • 一、内容目录
      • vscode 使用 TOC
    • 二、加强代码块
    • 三、标签和分类
    • 四、待办事宜 Todo
    • 五、流程图和时序图
      • 1、流程图(flowchat)
        • 1.1 基本语句:
        • 1.2 操作块
        • 1.3 操作模块详细说明
        • 1.4 流程控制
        • 1.5 FLOWCHAT示例
      • 2、时序图(sequence)
        • 2.1 示例
        • 2.2 流程控制
        • 2.3 成员定义和别名
    • 六、公式
      • 行内公式 $
      • 整行公式 $$
      • LaTex的公式规则
        • 转义
        • 希腊字母表
        • 上下标和根号
        • 分数
        • 运算符


一、内容目录

使用[TOC]引用目录,各种编辑器对[toc]的支持不一样,需通过插件支持。

例如本文目录:

@[toc](markdown高阶语法)
## 内容目录
### vscode 使用 TOC
## 我是标题2

在文章你想生成目录的地方使用 [toc]@[TOC](目录标题) 来生成目录。目录效果见文章上部目录。


vscode 使用 TOC

使用 ctrl + shift + x 打开应用商店,搜索拓展插件 Markdown TOC,点击下载。点击鼠标右键,发现选项栏里多了四个markdown相关的选项,点击 Markdown TOC:Insert/Update生成目录。

二、加强代码块

在基础用法里提过代码块的使用是```来包裹内容实现,加强代码块是在其基础上加上语言名称进行标记。

  • Javascript 为例:

/** @params: n > 0* @ a Javascript factorial function;*/
function factorial(n) {if (n === 1) return 1;return n * factorial(n - 1);
}

/** @params: n > 0* @ a Javascript factorial function;*/
function factorial(n) {if (n === 1) return 1;return n * factorial(n - 1);
}

注:

由上面示例可见,利用```只是简单生成一个代码块, 用加强代码块+语言类型```js 或者 ```Javascript 标注后,就可以实现代码高亮显示。

三、标签和分类

一般在文首输入tags添加标签,categories添加分类:

tags: - Markdown- 语言categories:- 技术

四、待办事宜 Todo

使用带有 [ ] 或 [x] (未完成或已完成)项的列表语法撰写一个待办事宜列表例如:

  • 早起晨跑
  • 吃早餐
  • 上班

五、流程图和时序图


1、流程图(flowchat)


1.1 基本语句:

tag=>type: content:>url

  • tag 就是元素名称。
  • type是这个元素的类型,有下面类型,分别为:
    1. 开始(椭圆形):start
    2. 结束(椭圆形):end
    3. 操作(矩形):operation
    4. 条件判断(菱形):condition
    5. 输入输出(平行四边形):inputoutput
    6. 预处理/子程序(圣旨形):subroutine

1.2 操作块

st=>start: 开始1. st 是变量名,类似php中数组索引,可以用英文,别定义的太离谱就行,如op_this,cond_echo
2. start 操作模块名,像数据类型 Int String,如:开始,结束,判断。命名严格,区别大小写。
3. 后面是要显示的文字

注意:冒号后要加空格


1.3 操作模块详细说明

1. #开始 startst=>start: 开始2. #结束 starten=>end: 结束3. #普通操作快 operationop1=>operation: 操作1op2=>operation: 操作24. #判断块 condition
cond1=>condition: 第一个判断
cond2=>condition: 第二个判断5. #输入输出块 inputoutput
io1=>inputoutput: 输入输出块1
io2=>inputoutput: 输入输出块26. #子任务块
sub1=>subroutine: 子任务1
sub2=>subroutine: 子任务2

1.4 流程控制

1. 流程控制-> 作为控制流程的操作符,就是指向下一步要操作的# st->op->e// 也可以分开写st->opop->e
2. 判断控制cond(yes)->op // yes 的时候回到 opcond(no)-e // no的时候结束cond(yes)->op(right) // 控制 op 位置于右边,也可以写成cond(yes, right)->op

1.5 FLOWCHAT示例

```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



2、时序图(sequence)


2.1 示例

```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


2.2 流程控制

"-" 表示实线
"--" 表示虚线
">" 表示黑体箭头
">>" 表示空心箭头

2.3 成员定义和别名

使用 participant 可定义成员,使用as 可以为成员定义别名。

title:成员定义
participant Client // 定义一个名叫client的成员
participant clinet as cl // 定义一个名叫client的成员别名(简称)cl

六、公式

当你需要在编辑器中插入数学公式时,可以使用两个美元符 $$ 包裹 LaTeX 格式的数学公式来实现。

行内公式 $

质能守恒方程:$E = mc^2$ 表达

质能守恒方程:E=mc2E = mc^2E=mc2 表达


整行公式 $$

$$ c = \sqrt{a^{2}+b_{xy}^{2} +e^{x}} $$

c=a2+bxy2+exc = \sqrt{a^{2}+b_{xy}^{2} +e^{x}} c=a2+bxy2+ex

LaTex的公式规则


转义

以下几个字符:# $ % & ~ _ ^ \ { }有特殊意义,需要表示这些字符时,需要转义,即在每个字符前加上\
\boxed 命令给公式加一个方框。

E=mc2\boxed{E=mc^2}E=mc2

希腊字母表

希腊字母表

上下标和根号


^ 来表示上标
_ 来表示下标
\sqrt 表示根号
注意:上下标如果多余一个字符或符号,需要用{}括起来。 \sqrt[开方次数,默认为2

$$\sqrt{x} \quad \sqrt[3]{y}$$

xy3\sqrt{x} \quad \sqrt[3]{y}x

3y


其中\quad表示添加空格

分数

分数用\frac表示
字号工具环境设置:
\dfrac命令把字号设置为独立公式中的大小;
\tfrac则把字号设置为行间公式中的大小。

$ \frac{1}{2} \dfrac{1}{2} $

1212\frac{1}{2} \dfrac{1}{2}2121

$$ \frac{1}{2} \tfrac{1}{2} $$

1212\frac{1}{2} \tfrac{1}{2} 2121

运算符


  • + - * / =直接输入;
  • 特殊运算则用以下特殊命令\pm; \times; \div; \cdot; \cap; \cup; \geq; \leq; \neq; \approx; \equiv
  • 和、积、极限、积分等运算符用\sum, \prod, \lim, \int,这些公式在行内公式被压缩,以适应行高,可以通过\limits和\nolimits命令显示制动是否压缩


推荐阅读
author-avatar
纪志鹏大利集客_776
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有