什么是 markdown ?
- Markdown 是一种轻量级的标记语言,可通过文本编辑器应用程序将 Markdown 格式元素添加到纯文本文件;
- markdown 文件最终一般是转化为 HTML 和 PDF 文件进行预览和传递;
为什么要使用 Markdown 而不是 WYSIWYG(所见即所得)编辑器(如:Microsoft Word 之类的应用程序)?
- Markdown可以用于一切。人们使用它来创建网站,文档,便笺,书籍,演示文稿,电子邮件和技术文档。
- Markdown是便携式的。指的是一般的应用程序都可以打开 Markdown 格式的文件(如:vsCode、Atom、sublimetext等代码开发工具),不像 Microsoft Word 等文字处理应用程序,Microsoft Word将文字内容锁定为专有文件格式;
- Markdown 是独立于平台的,你可以在任何操作系统上创建 Markdown 格式的文件;
- Markdown 运用广泛,像 GitHub 等知名网站都支持 Markdown;
尝试使用 Markdown
- 使用线上编辑器 dillinger,线上编辑器方便,因为你不用下载任何东西。
- 在本地文件系统中创建 .md(或 .markdown) 结尾的文件(如:readme.md),并用相关编辑器(推荐vscode。)打开进行 Markdown 语法尝试并预览。
Markdown 基础语法
注意:相比而言如果你更喜欢 HTML 标记,在 Markdown 中是可以使用 HTML 标签的。不妨去试试😎。
Markdown 标题
数字符号 # 的个数代表标题的级别(h1~h6级标题)
# 我是一级标题 相当于 <h1>我是一级标题</h1>
## 我是二级标题 相当于 <h2>我是二级标题</h2>
### 我是三级标题 相当于 <h3>我是三级标题</h3>
#### 我是四级标题 相当于 <h4>我是四级标题</h4>
##### 我是一级标题 相当于 <h5>我是五级标题</h5>
###### 我是六级标题 相当于 <h6>我是六级标题</h6>
标题级别一(#) 和 标题级别二(##) 的替代语法
注意:在文字下方加上任意数量的 = 号代表一级标题,在文字下边加上任意数量的 - 号代表二级标题
# 一级标题 相当于 一级标题
=======
## 二级标题 相当于 二级标题
------
段落
相当于 p 标签。使用空白行分割一行或多行文本(一定要空一行不然不会形成段落)。
我是段落一
我是段落二
换行
相当于 br 标签,在第一行文字后面加上两个以上的空格再回车完成换行,直接点击回车是不行的。
我是第一行
我是第二行
粗体
相当于 strong 标签。需要加粗的文字加在两个星号或者下划线之间。
你是**吴彦祖**吗? 相当于 你是<strong>吴彦祖</strong>吗?
我喜欢使用 __VUE__ 框架 相当于 我喜欢使用<strong>VUE</strong>框架
斜体
相当于 em 标签。需要加粗的文字加在一个星号或者下划线之间。
你是*吴彦祖*吗? 相当于 你是<em>吴彦祖</em>吗?
我喜欢使用 _VUE_ 框架 相当于 我喜欢使用<em>VUE</em>框架
加粗和斜体
相当于 strong 和 em 标签的组合。需要加粗的文字加在三个星号或者下划线之间。
你是***吴彦祖****吗? 相当于 你是<strong><em>吴彦祖</em></strong>吗?
我喜欢使用 ___VUE___ 框架 相当于 我喜欢使用<strong><em>VUE</em></strong>框架
块引用
> 我是一段引用
> 我是引用
我是一段引用 我是引用
嵌套引用
> 好好学习,天天向上
>> 书籍是人类进步的阶梯
好好学习,天天向上
书籍是人类进步的阶梯
块引用可以包含其他元素
> #### 你学过哪些前端框架?
> + vue
> + react
> + angular
你学过哪些前端框架?
- vue
- react
- angular
有序列表
注意:列表项需以数字(数字可以随机)加点号开头(如: 1. XXXXXX),但数字可以不随列表项递增而递增。相当于 ol 和 li 标签的组合。
1. 胡歌
2. 吴彦祖
3. 彭于晏
以下也合理
1. vue
1. react
1. jquery
- 胡歌
- 吴彦祖
- 彭于晏
以下也合理 - vue
- react
- jquery
无序列表
相当于 ul 和 li的组合。通过破折号(-),星号(*),加号(+)创建无序项
- html
- css
* react
* vue
+ javascript
+ typescript
- html
- css
- react
- vue
- javascript
- typescript
代码
相当于 code 标签
例:根据提示输入 `npm run start`
- 例:根据提示输入
npm run start
水平线
三个及以上的星号(*)、破折号(---)、下划线(______)
***
---
___
链接
为关键字添加链接和鼠标悬浮标题。
[点击我去百度](http://baidu.com "我是标题-百度")
网址和电子邮箱
<http://baidu.com>
<123456@qq.com>
图片
图片显示和设置标题

参考样式链接
给文本添加引用链接 效果相当于上面讲到的链接。引用样式链接包含两部分 用两个中括号表示 如:[vue][n]; 其中这个 n 相当于一个形参,它接收外部定义的变量 n;
好好学习[vue][2],😄
[2]: <https://vue3js.cn/docs/zh> 'vue3.js'
好好学习 vue。
扩展语法
由于以上的基础语法不满足人们的需求,所以新增了许多所需的元素。
表格
- 基础表格
| name | age |
| ---- | --- |
| jack | 18 |
name | age |
---|---|
jack | 18 |
- 文本对齐方式
| title | title2 | title3 |
| :-------- | ----: | :----: |
| 左对齐 | 右对齐 | 居中对齐 |
title | title2 | title3 |
---|---|---|
左对齐 | 右对齐 | 居中对齐 |
代码块
- 通过缩进四个空格或一个制表符创建代码块;
var a = 996;
var b = 666;
var a = 996;
var b = 666;
- 使用三个刻度线(```)解决缩进创建代码块的不方便和结构不鲜明;或三个波浪线(~~~)
```
我是三个刻度线包含的代码块
```
我是三个刻度线包含的代码块
代码块内语法高亮
在代码块内指定一种语言,不指定语言不会产生语法高亮
```json
{
"name":"vue",
"dec":"一个框架"
}
```
{
"name":"vue",
"dec":"一个框架"
}
脚注
为正文语法添加注释和参考。
1.使用 [^value]创建一个脚注,其中的 value 就相当于一个形参,对应跳转的链接;
2. 定义跳转的链接 ([^value]: 我是一个段解释)
这是一段脚注,[^footnote] 哈哈哈哈
[^footnote]: 我是一段脚注
这是一段脚注,1 哈哈哈哈
删除线
将需要删除的单词放入两个波浪线(~~)之中
~~我有钱~~,不,我很穷
我有钱,不,我很穷
复选框列表
(-)号加上中括号[] 代表一个复选框项,(x)代表选中;
- [x] 学习 JavaScript
- [ ] 学习 Vue
- [ ] 学习 React
- 学习 JavaScript
- 学习 Vue
- 学习 React
网址链接
- 默认将 url 转为链接(url 不加任何修饰)
http://baidu.com
- 禁止 url 跳转(使用代码禁止)
`http://baidu.com`
http://baidu.com
Footnotes
-
我是一段脚注 ↩