vscode使用Markdown文档编写

 

首先安装vscode工具,具体的使用可以参考之前的博文:《Visual Studio Code教程:基础使用和自定义设置》

VScode已经默认集成markdown文档编辑插件。
可以新建一个.md文件
Visual Studio Code 原生就支持高亮Markdown的语法,想要一边编辑一遍预览,有两种方法:
1.Ctrl + Shift + P 调出主命令框,输入 Markdown,应该会匹配到几项 Markdown相关命令

2.先按Ctrl + K,然后放掉,紧接着再按 v,也能调出实时预览框。【要在英文输入状态下】

附录:markdown语法:

1.标题

代码

注:# 后面保持空格

# h1
## h2
### h3
#### h4
##### h5
###### h6
####### h7 // 错误代码
######## h8 // 错误代码
######### h9 // 错误代码
########## h10 // 错误代码

演示

h1

h2

h3

h4

h5
h6

####### h7
######## h8
######### h9
########## h10


2.分级标题

代码
注:= - 最少可以只写一个,兼容性一般

一级标题
======================
二级标题
---------------------

演示

 

3.TOC

注:根据标题生成目录,兼容性一般

代码

[TOC]

演示

 

4.引用

代码1(单行式)

> hello world!

演示

hello world!

代码2(多行式)

> hello world!
hello world!
hello world!

或者

> hello world!
> hello world!
> hello world!

演示

相同的结果

hello world!
hello world!
hello world!

代码3(多层嵌套)

> aaaaaaaaa
>> bbbbbbbbb
>>> cccccccccc

演示

aaaaaaaaa

bbbbbbbbb

cccccccccc


5.行内标记

注:用 ` 标记代码块将变成一行

代码

标记之外`hello world`标记之外

演示

标记之外hello world标记之外

错误代码
注:不同平台错误略有差异

 标记之外 `
< div>
< div></div>
< div></div>
< div></div>
< /div>
`标记之外

演示

 

6.代码块

注:与上行距离一空行

代码1(```)

注:用```生成块

```
<div>
<div></div>
<div></div>
<div></div>
</div>
```

演示

<div>
<div></div>
<div></div>
<div></div>
</div>

代码2(Tab)

注: Tab缩进

我是文字……

    <div>
<div></div>
<div></div>
<div></div>
</div>

演示

<div>
<div></div>
<div></div>
<div></div>
</div>

代码3(自定义语法)
注:根据不同的语言配置不同的代码着色

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

7.插入链接

代码1(内链式)
注:{:target="_blank"}跳转方式兼容性一般 ,多数第三方平台不支持跳转

[百度1](http://www.baidu.com/" 百度一下"){:target="_blank"}

演示

百度1

代码2(引用式)

[百度2][2]{:target="_blank"}
[2]: http://www.baidu.com/ "百度二下"

演示

百度2


8.插入图片

代码1(内链式)

![](./01.png '描述')

演示

 

代码2(引用式)

![name][01]
[01]: ./01.png '描述'

演示

 

9.插入图片带有链接

代码

[![](./01.png '百度')](http://www.baidu.com){:target="_blank"}        // 内链式

[![](./01.png '百度')][5]{:target="_blank"}                       // 引用式
[5]: http://www.baidu.com

演示

[

 

][5]
[5]: http://www.baidu.com


10.视频插入

注:Markdown 语法是不支持直接插入视频的
普遍的做法是 插入HTML的 iframe 框架,通过网站自带的分享功能获取,如果没有可以尝试第二种方法
第二是伪造播放界面,实质是插入视频图片,然后通过点击跳转到相关页面

代码1
注:多数第三方平台不支持插入<iframe>视频

youku
<iframe height=498 width=510 src='http://player.youku.com/embed/XMjgzNzM0NTYxNg==' frameborder=0 'allowfullscreen'></iframe>

演示

 

代码2

[![](./youku2.png)](http://v.youku.com/v_show/id_XMjgzNzM0NTYxNg==.html?spm=a2htv.20009910.contentHolderUnit2.A&from=y1.3-tv-grid-1007-9910.86804.1-2#paction){:target="_blank"}

演示


11.序表

代码1(有序)

注:序列.后 保持空格

1. one
2. two
3. three

演示

  1. one
  2. two
  3. three

代码2(无序)

* one
* two
* three

演示

  • one
  • two
  • three

代码3(序表嵌套)

1. one
1. one-1
2. two-2
2. two
* two-1
* two-2

演示

  1. one
    1. one-1
    2. two-2
  2. two
    • two-1
    • two-2

代码4(序表嵌套代码块)
注:换行+两个Tab

* one

    var a = 10;     // 与上行保持空行并 递进缩进

演示:

  • one

      var a = 10;

12.任务列表

注:兼容性一般 要隔开一行

代码

这是文字……

- [x] 选项一
- [ ] 选项二
- [ ] [选项3]

演示

 

13.表情

注:兼容一般

 

表情代码地址


14.表格

注: : 代表对齐方式 ,** : 与 | 之间不要有空格**,否则对齐会有些不兼容

代码1

|    a    |       b       |      c     |
|:-------:|:------------- | ----------:|
| 居中 | 左对齐 | 右对齐 |
|=========|===============|============|

演示

a b c
居中 左对齐 右对齐
========= =============== ============

代码2(简约写法)

a  | b | c
:-:|:- |-:
居中 | 左对齐 | 右对齐
============|=================|=============

演示

a b c
居中 左对齐 右对齐
============ ================= =============

代码3(特殊表格)

注:一般对合并单元格,以及其他特殊格式表格,markdown 是无能为力的
所以常规的做法是使用HTML标签,但是这样的编写效率极低。
但是有了这款工具的话,所有问题都迎刃而解。

在线生成HTML代码 Tables Generator (国外的站)

Tables Generator

演示

 

15.支持内嵌CSS样式

代码

<p style="color: #AD5D0F;font-size: 30px; font-family: '宋体';">内联样式</p>

演示

 

16.语义标记

描述 效果 代码
斜体 斜体 *斜体*
斜体 斜体 _斜体_
加粗 加粗 **加粗**
加粗+斜体 加粗+斜体 ***加粗+斜体***
加粗+斜体 加粗+斜体 **_加粗+斜体_**
删除线 删除线 ~~删除线~~

17.语义标签

描述 效果 代码
斜体 <i>斜体</i> <i>斜体</i>
加粗 <b>加粗</b> <b>加粗</b>
强调 <em>强调</em> <em>强调</em>
上标 Za Z<sup>a</sup>
下标 Za Z<sub>a</sub>
键盘文本
 
 
<kbd>Ctrl</kbd>
换行    

18.格式化文本

保持输入排版格式不变
注:对内含标签需要破坏结构才能显示

代码

<pre>
hello world
hi
hello world
</pre>

演示

<pre>
hello world
hi
hello world
</pre>

错误解决方法
注:标签内部添加空格 或者 直接使用```标记来处理
代码1(插入空格)

<pre>
< div>
< div>< /div>
< div>< /div>
< div>< /div>
< /div>
</pre>

演示

<pre>
< div>
< div>< /div>
< div>< /div>
< div>< /div>
< /div>
</pre>

代码2( ``` 代码块标记)

```
<div>
<div></div>
<div></div>
<div></div>
</div>
```

演示

<div>
<div></div>
<div></div>
<div></div>
</div>

19.公式 {#1}

注:1个$左对齐,2个居中

代码

$$ x \href{why-equal.html}{=} y^2 + 1 $$
$ x = {-b \pm \sqrt{b^2-4ac} \over 2a}. $

演示

 

20.分隔符

注:最少三个 --- 或 ***或 * * *

代码

***
---
* * *

演示




21.脚注

代码

Markdown[^1]
[^1]: Markdown是一种纯文本标记语言 // 在文章最后面显示脚注

演示

Markdown[1]


22.锚点

代码
注:只有标题支持锚点, 跳转目录方括号后 保持空格

[公式标题锚点](#1)

### [需要跳转的目录] {#1}    // 方括号后保持空格

演示

公式标题锚点


23.定义型列表

注:解释型定义
代码

Markdown
: 轻量级文本标记语言,可以转换成html,pdf等格式 // 开头一个`:` + `Tab` 或 四个空格 代码块定义
: 代码块定义…… var a = 10; // 保持空一行与 递进缩进

演示

 

24.自动邮箱链接

代码

<xxx@outlook.com>

演示

xxx@outlook.com


25.流程图

代码1

```flow                     // 流程
st=>start: 开始|past:> http://www.baidu.com // 开始
e=>end: 结束 // 结束
c1=>condition: 条件1:>http://www.baidu.com[_parent] // 判断条件
c2=>condition: 条件2 // 判断条件
c3=>condition: 条件3 // 判断条件
io=>inputoutput: 输出 // 输出
//----------------以上为定义参数------------------------- //----------------以下为连接参数-------------------------
// 开始->判断条件1为no->判断条件2为no->判断条件3为no->输出->结束
st->c1(yes,right)->c2(yes,right)->c3(yes,right)->io->e
c1(no)->e // 条件1不满足->结束
c2(no)->e // 条件2不满足->结束
c3(no)->e // 条件3不满足->结束
```

演示

 

代码详解
流程图分为两个部分: 定义参数 然后 连接参数

定义示例:

tag=>type: content:>url         // 形参格式
st=>start: 开始:>http://www.baidu.com[blank] //实参格式

注:** st=>start: 开始 的后面保持空格**

形参 实参 含义
tag st 标签 (可以自定义)
=> => 赋值
type start 类型 (6种类型)
content 开始 描述内容 (可以自定义)
:>url http://www.baidu.com[blank] 链接与跳转方式 兼容性很差
6种类型 含义
start 启动
end 结束
operation 程序
subroutine 子程序
condition 条件
inputoutput 输出

连接示例:

st->c1(yes,right)->c2(yes,right)->c3(yes,right)->io->e
开始->判断条件1为no->判断条件2为no->判断条件3为no->输出->结束
形参 实参 含义
-> -> 连接
condition c1 条件
(布尔值,方向) (yes,right) 如果满足向右连接,4种方向:right ,left,up ,down 默认为:down

注:operation (程序); subroutine (子程序) ;condition (条件),都可以在括号里加入连接方向。

operation(right)
subroutine(left)
condition(yes,right) // 只有条件 才能加布尔值

代码2

注:添加样式和url跳转 需要添加第三方的脚本
实际效果很差,使用起来麻烦,意义不大

```flow                             // 流程
st=>start: 启动|past:>http://www.baidu.com[blank] // 开始
e=>end: 结束 // 结束
op1=>operation: 方案一 // 运算1
sub2=>subroutine: 方案二|approved:>http://www.baidu.com[_parent] // 运算2
sub3=>subroutine: 重新制定方案 // 运算2
cond1=>condition: 行不行?|request // 判断条件1
cond2=>condition: 行不行? // 判断条件2
io=>inputoutput: 结果满意 // 输出 // 开始->方案1->判断条件->
st->op1->cond1
// 判断条件1为no->方案2->判断条件2为no->重新制定方案->方案1
cond1(no,right)->sub2->cond2(no,right)->sub3(right)->op1
cond1(yes)->io->e // 判断条件满足->输出->结束
cond2(yes)->io->e // 判断条件满足->输出->结束
```

演示

 

作者地址:flowchart.js

一般普遍支持的效果

 

26.时序图

代码1

```sequence
A->>B: 你好
Note left of A: 我在左边 // 注释方向,只有左右,没有上下
Note right of B: 我在右边
B-->A: 很高兴认识你
```

演示

 

代码详解

注:A->>B: 你好 后面可以不写文字,但是一定要在最后加上
Note left of A 代表注释在A的左边

符号 含义
- 实线
> 实心箭头
-- 虚线
>> 空心箭头

代码2

    ```sequence
起床->吃饭: 稀饭油条
吃饭->上班: 不要迟到了
上班->午餐: 吃撑了
上班->下班:
Note right of 下班: 下班了
下班->回家:
Note right of 回家: 到家了
回家-->>起床:
Note left of 起床: 新的一天
```

演示

 

27.生成侧边栏扩展

注:生成侧边栏一般是插入JS,再就是模板,
总体来说,很是麻烦,效果一般,不作详解。

作者仓库:i5ting_ztree_toc

语法原文:https://www.jianshu.com/p/b03a8d7b1719

1.标题

代码

注:# 后面保持空格

# h1
## h2
### h3
#### h4
##### h5
###### h6
####### h7 // 错误代码
######## h8 // 错误代码
######### h9 // 错误代码
########## h10 // 错误代码

演示

h1

h2

h3

h4

h5
h6

####### h7
######## h8
######### h9
########## h10


2.分级标题

代码
注:= - 最少可以只写一个,兼容性一般

一级标题
======================
二级标题
---------------------

演示

 
 

3.TOC

注:根据标题生成目录,兼容性一般

代码

[TOC]

演示

 
 

4.引用

代码1(单行式)

> hello world!

演示

hello world!

代码2(多行式)

> hello world!
hello world!
hello world!

或者

> hello world!
> hello world!
> hello world!

演示

相同的结果

hello world!
hello world!
hello world!

代码3(多层嵌套)

> aaaaaaaaa
>> bbbbbbbbb
>>> cccccccccc

演示

aaaaaaaaa

bbbbbbbbb

cccccccccc


5.行内标记

注:用 ` 标记代码块将变成一行

代码

标记之外`hello world`标记之外

演示

标记之外hello world标记之外

错误代码
注:不同平台错误略有差异

 标记之外 `
< div>
< div></div>
< div></div>
< div></div>
< /div>
`标记之外

演示

 
 

6.代码块

注:与上行距离一空行

代码1(```)

注:用```生成块

```
<div>
<div></div>
<div></div>
<div></div>
</div>
```

演示

<div>
<div></div>
<div></div>
<div></div>
</div>

代码2(Tab)

注: Tab缩进

我是文字……

    <div>
<div></div>
<div></div>
<div></div>
</div>

演示

<div>
<div></div>
<div></div>
<div></div>
</div>

代码3(自定义语法)
注:根据不同的语言配置不同的代码着色

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

7.插入链接

代码1(内链式)
注:{:target="_blank"}跳转方式兼容性一般 ,多数第三方平台不支持跳转

[百度1](http://www.baidu.com/" 百度一下"){:target="_blank"}

演示

百度1

代码2(引用式)

[百度2][2]{:target="_blank"}
[2]: http://www.baidu.com/ "百度二下"

演示

百度2


8.插入图片

代码1(内链式)

![](./01.png '描述')

演示

 
 

代码2(引用式)

![name][01]
[01]: ./01.png '描述'

演示

 
 

9.插入图片带有链接

代码

[![](./01.png '百度')](http://www.baidu.com){:target="_blank"}        // 内链式

[![](./01.png '百度')][5]{:target="_blank"}                       // 引用式
[5]: http://www.baidu.com

演示

 

[

 
 

][5]
[5]: http://www.baidu.com


10.视频插入

注:Markdown 语法是不支持直接插入视频的
普遍的做法是 插入HTML的 iframe 框架,通过网站自带的分享功能获取,如果没有可以尝试第二种方法
第二是伪造播放界面,实质是插入视频图片,然后通过点击跳转到相关页面

代码1
注:多数第三方平台不支持插入<iframe>视频

 
youku
<iframe height=498 width=510 src='http://player.youku.com/embed/XMjgzNzM0NTYxNg==' frameborder=0 'allowfullscreen'></iframe>

演示

 
 

代码2

[![](./youku2.png)](http://v.youku.com/v_show/id_XMjgzNzM0NTYxNg==.html?spm=a2htv.20009910.contentHolderUnit2.A&from=y1.3-tv-grid-1007-9910.86804.1-2#paction){:target="_blank"}

演示

 

11.序表

代码1(有序)

注:序列.后 保持空格

1. one
2. two
3. three

演示

  1. one
  2. two
  3. three

代码2(无序)

* one
* two
* three

演示

  • one
  • two
  • three

代码3(序表嵌套)

1. one
1. one-1
2. two-2
2. two
* two-1
* two-2

演示

  1. one
    1. one-1
    2. two-2
  2. two
    • two-1
    • two-2

代码4(序表嵌套代码块)
注:换行+两个Tab

* one

    var a = 10;     // 与上行保持空行并 递进缩进

演示:

  • one

      var a = 10;

12.任务列表

注:兼容性一般 要隔开一行

代码

这是文字……

- [x] 选项一
- [ ] 选项二
- [ ] [选项3]

演示

 
 

13.表情

注:兼容一般

 
 

表情代码地址


14.表格

注: : 代表对齐方式 ,** : 与 | 之间不要有空格**,否则对齐会有些不兼容

代码1

|    a    |       b       |      c     |
|:-------:|:------------- | ----------:|
| 居中 | 左对齐 | 右对齐 |
|=========|===============|============|

演示

a b c
居中 左对齐 右对齐
========= =============== ============

代码2(简约写法)

a  | b | c
:-:|:- |-:
居中 | 左对齐 | 右对齐
============|=================|=============

演示

a b c
居中 左对齐 右对齐
============ ================= =============

代码3(特殊表格)

注:一般对合并单元格,以及其他特殊格式表格,markdown 是无能为力的
所以常规的做法是使用HTML标签,但是这样的编写效率极低。
但是有了这款工具的话,所有问题都迎刃而解。

在线生成HTML代码 Tables Generator (国外的站)

 
Tables Generator

演示

 
 

15.支持内嵌CSS样式

代码

<p style="color: #AD5D0F;font-size: 30px; font-family: '宋体';">内联样式</p>

演示

 
 

16.语义标记

描述 效果 代码
斜体 斜体 *斜体*
斜体 斜体 _斜体_
加粗 加粗 **加粗**
加粗+斜体 加粗+斜体 ***加粗+斜体***
加粗+斜体 加粗+斜体 **_加粗+斜体_**
删除线 删除线 ~~删除线~~

17.语义标签

描述 效果 代码
斜体 <i>斜体</i> <i>斜体</i>
加粗 <b>加粗</b> <b>加粗</b>
强调 <em>强调</em> <em>强调</em>
上标 Za Z<sup>a</sup>
下标 Za Z<sub>a</sub>
键盘文本
 
 
<kbd>Ctrl</kbd>
换行    

18.格式化文本

保持输入排版格式不变
注:对内含标签需要破坏结构才能显示

代码

<pre>
hello world
hi
hello world
</pre>

演示

<pre>
hello world
hi
hello world
</pre>

错误解决方法
注:标签内部添加空格 或者 直接使用```标记来处理
代码1(插入空格)

<pre>
< div>
< div>< /div>
< div>< /div>
< div>< /div>
< /div>
</pre>

演示

<pre>
< div>
< div>< /div>
< div>< /div>
< div>< /div>
< /div>
</pre>

代码2( ``` 代码块标记)

```
<div>
<div></div>
<div></div>
<div></div>
</div>
```

演示

<div>
<div></div>
<div></div>
<div></div>
</div>

19.公式 {#1}

注:1个$左对齐,2个居中

代码

$$ x \href{why-equal.html}{=} y^2 + 1 $$
$ x = {-b \pm \sqrt{b^2-4ac} \over 2a}. $

演示

 
 

20.分隔符

注:最少三个 --- 或 ***或 * * *

代码

***
---
* * *

演示




21.脚注

代码

Markdown[^1]
[^1]: Markdown是一种纯文本标记语言 // 在文章最后面显示脚注

演示

Markdown[1]


22.锚点

代码
注:只有标题支持锚点, 跳转目录方括号后 保持空格

[公式标题锚点](#1)

### [需要跳转的目录] {#1}    // 方括号后保持空格

演示

公式标题锚点


23.定义型列表

注:解释型定义
代码

Markdown
: 轻量级文本标记语言,可以转换成html,pdf等格式 // 开头一个`:` + `Tab` 或 四个空格 代码块定义
: 代码块定义…… var a = 10; // 保持空一行与 递进缩进

演示

 
 

24.自动邮箱链接

代码

<xxx@outlook.com>

演示

xxx@outlook.com


25.流程图

代码1

```flow                     // 流程
st=>start: 开始|past:> http://www.baidu.com // 开始
e=>end: 结束 // 结束
c1=>condition: 条件1:>http://www.baidu.com[_parent] // 判断条件
c2=>condition: 条件2 // 判断条件
c3=>condition: 条件3 // 判断条件
io=>inputoutput: 输出 // 输出
//----------------以上为定义参数------------------------- //----------------以下为连接参数-------------------------
// 开始->判断条件1为no->判断条件2为no->判断条件3为no->输出->结束
st->c1(yes,right)->c2(yes,right)->c3(yes,right)->io->e
c1(no)->e // 条件1不满足->结束
c2(no)->e // 条件2不满足->结束
c3(no)->e // 条件3不满足->结束
```

演示

 
 

代码详解
流程图分为两个部分: 定义参数 然后 连接参数

定义示例:

tag=>type: content:>url         // 形参格式
st=>start: 开始:>http://www.baidu.com[blank] //实参格式

注:** st=>start: 开始 的后面保持空格**

形参 实参 含义
tag st 标签 (可以自定义)
=> => 赋值
type start 类型 (6种类型)
content 开始 描述内容 (可以自定义)
:>url http://www.baidu.com[blank] 链接与跳转方式 兼容性很差
6种类型 含义
start 启动
end 结束
operation 程序
subroutine 子程序
condition 条件
inputoutput 输出

连接示例:

st->c1(yes,right)->c2(yes,right)->c3(yes,right)->io->e
开始->判断条件1为no->判断条件2为no->判断条件3为no->输出->结束
形参 实参 含义
-> -> 连接
condition c1 条件
(布尔值,方向) (yes,right) 如果满足向右连接,4种方向:right ,left,up ,down 默认为:down

注:operation (程序); subroutine (子程序) ;condition (条件),都可以在括号里加入连接方向。

operation(right)
subroutine(left)
condition(yes,right) // 只有条件 才能加布尔值

代码2

注:添加样式和url跳转 需要添加第三方的脚本
实际效果很差,使用起来麻烦,意义不大

```flow                             // 流程
st=>start: 启动|past:>http://www.baidu.com[blank] // 开始
e=>end: 结束 // 结束
op1=>operation: 方案一 // 运算1
sub2=>subroutine: 方案二|approved:>http://www.baidu.com[_parent] // 运算2
sub3=>subroutine: 重新制定方案 // 运算2
cond1=>condition: 行不行?|request // 判断条件1
cond2=>condition: 行不行? // 判断条件2
io=>inputoutput: 结果满意 // 输出 // 开始->方案1->判断条件->
st->op1->cond1
// 判断条件1为no->方案2->判断条件2为no->重新制定方案->方案1
cond1(no,right)->sub2->cond2(no,right)->sub3(right)->op1
cond1(yes)->io->e // 判断条件满足->输出->结束
cond2(yes)->io->e // 判断条件满足->输出->结束
```

演示

 
 

作者地址:flowchart.js

一般普遍支持的效果

 
 

26.时序图

代码1

```sequence
A->>B: 你好
Note left of A: 我在左边 // 注释方向,只有左右,没有上下
Note right of B: 我在右边
B-->A: 很高兴认识你
```

演示

 
 

代码详解

注:A->>B: 你好 后面可以不写文字,但是一定要在最后加上
Note left of A 代表注释在A的左边

符号 含义
- 实线
> 实心箭头
-- 虚线
>> 空心箭头

代码2

    ```sequence
起床->吃饭: 稀饭油条
吃饭->上班: 不要迟到了
上班->午餐: 吃撑了
上班->下班:
Note right of 下班: 下班了
下班->回家:
Note right of 回家: 到家了
回家-->>起床:
Note left of 起床: 新的一天
```

演示

 
 

27.生成侧边栏扩展

注:生成侧边栏一般是插入JS,再就是模板,
总体来说,很是麻烦,效果一般,不作详解。

作者仓库:i5ting_ztree_toc

转载自shawWey      链接https://www.cnblogs.com/shawWey/    转载均已注明来源

 

vscode 编写Markdown文件的更多相关文章

  1. 使用vscode 编写Markdown文件

    markdown简单语法参考下面简单事例: # 一级标题 1. 有序列表1 >1. 有序列表1 >>- *test1* >>- **test2** >>- * ...

  2. vscode 编辑markdown文件

    关于换行问题 在vscode中编写Markdown文件时,会遇到明明按回车换行了但是预览的时候却没有换行的情况,这时在需要换行的地方多按两次空格键,就会换行 预览markdown文件 编辑器右上角有个 ...

  3. 使用vscode编辑markdown文件(可粘贴截图)

    使用markdown粘贴截图时,操作步骤比较多: 1)截取图片: 2)将图片存在特定位置: 3)记住图片路径,在markdown文件中编写代码: 4)预览效果: 而word之类的文档编辑器,只需要截图 ...

  4. 使用VS Code编写Markdown文件

    VS Code默认支持Markdown文件文件格式,这里介绍两个比较实用的功能,后续有新发现,可以持续更新. 实时预览 顾名思义,实时编辑,实时预览解析效果. 在VS Code扩展中搜索"M ...

  5. sublime编写markdown文件中Ctrl+B的作用

    今天,手残,用markdown编辑是按了Ctrl+B,结果发现直接在同一文件夹目录下编译生成了html文件,之前都是Alt+m,可以直接预览,可是后来由于系统更新还是什么,Alt+m只会在用户目录(而 ...

  6. 使用vscode书写markdown文件

    插件推荐 markdown-preview-enhanced 打开 vscode 编辑器,在插件页搜索 markdown-preview-enhanced,接着点击 Install 按钮. 该插件的中 ...

  7. 使用VScode编写Markdown的一些使用技巧

  8. VScode格式化vue文件

    使用vscode编写vue文件的时候, 发现不能格式化,手动格式化代码,太费劲, 还有可能会出错, 不格式化,有的时候代码编写的时候, 没有很好的管理格式,不美观. 但是我们是可以修改让VScode可 ...

  9. 解析Markdown文件生成React组件文档

    前言 最近做的项目使用了微前端框架single-spa. 对于这类微前端框架而言,通常有个utility应用,也就是公共应用,里面是各个子应用之间可以共用的一些公共组件或者方法. 对于一个团队而言,项 ...

随机推荐

  1. Linux_LEMP

    目录 目录 LEMP Nginx mysql PHP php-fpm Script LEMP Nginx是一个高性能的HTTP和反向代理服务器,也是一个 IMAP/POP3/SMTP 服务器,因它的稳 ...

  2. 阶段3 1.Mybatis_06.使用Mybatis完成DAO层的开发_5 Mybatis中使用Dao实现类的执行过程分析-查询方法1

    继续运行testFindAll方法.把其他类的断点都删除掉. 只在这里加了断点,所以直接就跳转到这里了.RoutingStatementHandler里面的query方法 继续往下走,断点又回到了这里 ...

  3. 基于Python对象引用、可变性和垃圾回收详解

    基于Python对象引用.可变性和垃圾回收详解 下面小编就为大家带来一篇基于Python对象引用.可变性和垃圾回收详解.小编觉得挺不错的,现在就分享给大家,也给大家做个参考. 变量不是盒子 在示例所示 ...

  4. SHELL输出颜色和闪烁控制

    Shell 颜色和闪烁控制 在Shell下有时候需要定制输出,比如给输出加上颜色,或者显示高亮,或者添加闪烁等. 然后这些颜色代码或者控制码等相对不好记住.这个时候我们可以考虑把最终想要的结果制定成对 ...

  5. C++:补齐函数编写递归函数计算x的y次幂(hhhh函数 !头疼!)

    编写递归函数计算x的y次幂,在主程序中输入非零整数x和整数y,输出求幂的结果(保留两位小数).考虑y为负数和0的情况. #include<iostream> #include<iom ...

  6. 2d平台怪物逻辑

    2d来回巡逻 遇到坑会自动转向 可配置单次方向行走的时间,转向等待时间等 using System; using System.Collections; using System.Collection ...

  7. Win10.输入法(控制面板)

    1.之前 Win7 都是每个进程都是自己的输入法. 但是到了Win10 默认情况下 输入法是全局的,输入法切换成中文 所有进程都变成 中文输入,又是很不方便 也不习惯... 2.感觉 WIn10 真不 ...

  8. Go语言入门篇-jwt(json web token)权限验证

    一.token.cookie.session的区别 1.cookie Cookie总是保存在客户端中,按在客户端中的存储位置,可分为内存Cookie和硬盘Cookie. 内存Cookie由浏览器维护, ...

  9. [19/05/29-星期三] JavaScript_ 函数的简介

    一.函数的简介 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <t ...

  10. [P5348]密码解锁

    Description 给一个长度为 \(n\) 的数组 \(a[1\dots n]\) ,满足 \(\sum_{m|x}a[x] = \mu(m)\),求 \(a[m]\). \(n\le 10^{ ...