vscode 编写Markdown文件

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
注：多数第三方平台不支持插入