Markdown语法完全指南:从新手到熟练

本文最后更新于 9 个月前,文中所描述的信息可能已发生改变。

欢迎来到Markdown的世界!🎉

如果你是开发者、写作者或者只是想让自己的文档更加优雅,那么Markdown绝对是你的最佳选择。它简单、高效,而且几乎在所有地方都能使用——GitHub、博客、文档网站、笔记应用等等。

这份指南将带你从零基础掌握Markdown,让你的文档编写变得轻松有趣!

🚀 为什么选择Markdown? ​

  • 简单易学:只需要几个符号就能创建美观的文档
  • 专注内容:不用担心格式问题,专心写作
  • 广泛支持:GitHub、Reddit、Discord等平台都支持
  • 版本控制友好:纯文本格式,Git管理无压力

📝 基础语法 ​

标题 - 让内容有层次 ​

使用 # 符号创建标题,就像这样:

markdown
# 一级标题 - 用于文章主标题
## 二级标题 - 用于章节标题
### 三级标题 - 用于子章节
#### 四级标题 - 用于详细分类
##### 五级标题 - 很少用到
###### 六级标题 - 最小的标题

效果展示:

一级标题 - 用于文章主标题 ​

二级标题 - 用于章节标题 ​

三级标题 - 用于子章节 ​

四级标题 - 用于详细分类 ​

五级标题 - 很少用到 ​
六级标题 - 最小的标题 ​

💡 小技巧:记住在 # 后面加空格,这是好习惯!

文本格式 - 让文字更有表现力 ​

markdown
**粗体文字** 或 __粗体文字__
*斜体文字* 或 _斜体文字_
***粗斜体*** 或 ___粗斜体___
~~删除线文字~~

效果展示:

粗体文字 看起来很重要 斜体文字 显得很优雅 粗斜体 既重要又优雅 删除线文字 表示不再需要

列表 - 整理你的思路 ​

无序列表 ​

用 -、+ 或 * 都可以,选择你喜欢的:

markdown
- 苹果 🍎
- 香蕉 🍌
- 橘子 🍊

* 学习Markdown
* 写技术博客
* 提高效率

+ 早起
+ 运动
+ 读书

效果展示:

  • 苹果 🍎
  • 香蕉 🍌
  • 橘子 🍊

有序列表 ​

数字加点号就搞定:

markdown
1. 第一步:打开编辑器
2. 第二步:开始写作
3. 第三步:保存文件

效果展示:

  1. 第一步:打开编辑器
  2. 第二步:开始写作
  3. 第三步:保存文件

嵌套列表 ​

使用缩进(Tab或4个空格)创建层次:

markdown
1. 前端技术
   - HTML
   - CSS
   - JavaScript
     - Vue.js
     - React
2. 后端技术
   - Node.js
   - Python
   - Java

效果展示:

  1. 前端技术
    • HTML
    • CSS
    • JavaScript
      • Vue.js
      • React
  2. 后端技术
    • Node.js
    • Python
    • Java

引用 - 优雅地引用他人观点 ​

markdown
> 生活就像一盒巧克力,你永远不知道下一颗是什么味道。
>
> —— 《阿甘正传》

效果展示:

生活就像一盒巧克力,你永远不知道下一颗是什么味道。

—— 《阿甘正传》

嵌套引用 ​

markdown
> 这是一级引用
>
> > 这是二级引用
> >
> > > 这是三级引用

效果展示:

这是一级引用

这是二级引用

这是三级引用

💻 代码相关 ​

行内代码 ​

用反引号包裹:

markdown
使用 `console.log()` 来输出信息

效果展示:

使用 console.log() 来输出信息

代码块 ​

用三个反引号包裹,还可以指定语言高亮:

markdown
```javascript
function greet(name) {
    console.log(`Hello, ${name}!`);
}

greet('World');
```

效果展示:

javascript
function greet(name) {
    console.log(`Hello, ${name}!`);
}

greet('World');

💡 小技巧:支持的语言包括 javascript、python、java、css、html、bash 等。

🔗 链接和图片 ​

链接 ​

markdown
[思米米的博客](https://www.simimi.cn)
[思米米的博客](https://www.simimi.cn "鼠标悬停显示的标题")

效果展示:

思米米的博客

图片 ​

markdown
![图片描述](图片链接)
![思米米头像](//q1.qlogo.cn/g?b=qq&nk=79099400&s=640 "这是头像")

效果展示:

思米米头像
这是头像

引用式链接和图片 ​

当你需要在文档中多次使用同一个链接时,这样更方便:

markdown
[思米米][blog]
[关于页面][about]
![头像][avatar]

[blog]: https://www.simimi.cn "思米米的博客"
[about]: https://www.simimi.cn/about "关于思米米"
[avatar]: //q1.qlogo.cn/g?b=qq&nk=79099400&s=640 "思米米头像"

效果展示:

思米米关于页面头像

📊 表格 ​

markdown
| 姓名 | 年龄 | 职业 |
|------|:----:|-----:|
| 张三 | 25   | 程序员 |
| 李四 | 30   | 设计师 |
| 王五 | 28   | 产品经理 |

效果展示:

姓名年龄职业
张三25程序员
李四30设计师
王五28产品经理

💡 对齐方式:

  • |:---| 左对齐
  • |:---:| 居中对齐
  • |---:| 右对齐

✨ 进阶技巧 ​

分割线 ​

markdown
---
***
___

效果展示:


转义字符 ​

当你需要显示Markdown符号本身时:

markdown
\*不是斜体\*
\#不是标题
\[不是链接\]

效果展示:

*不是斜体* #不是标题 [不是链接]

HTML元素 ​

Markdown支持一些HTML标签:

markdown
使用 <kbd>Ctrl</kbd> + <kbd>C</kbd> 复制
<mark>高亮文本</mark>
H<sub>2</sub>O(下标)
X<sup>2</sup>(上标)

效果展示:

使用 Ctrl + C 复制 高亮文本 H2O(下标) X2(上标)

🎯 最佳实践 ​

1. 保持一致性 ​

  • 选择一种列表符号(-、+、*)并坚持使用
  • 保持缩进的一致性(推荐使用4个空格)

2. 空行的艺术 ​

markdown
# 标题

这是第一段内容。

这是第二段内容。

- 列表项1
- 列表项2

3. 善用预览 ​

  • 大部分编辑器都有预览功能,及时查看效果
  • 推荐编辑器:Typora、Mark Text、VS Code

4. 文件组织 ​

markdown
# 主标题

## 概述

## 详细内容

### 子章节1

### 子章节2

## 总结

🛠️ 实用工具推荐 ​

编辑器 ​

  • Typora:所见即所得,新手友好
  • Mark Text:免费开源,功能强大
  • VS Code:程序员首选,插件丰富

在线工具 ​

  • Dillinger:在线Markdown编辑器
  • StackEdit:支持同步的在线编辑器

学习资源 ​

📚 总结 ​

恭喜你!现在你已经掌握了Markdown的精髓。记住:

  1. 多练习:熟能生巧,多写多用
  2. 保持简单:不要过度格式化
  3. 专注内容:好的内容比华丽的格式更重要
  4. 建立习惯:让Markdown成为你的第二天性

现在就开始你的Markdown之旅吧!从写一个简单的README开始,或者用Markdown记录你的学习笔记。你会发现,写文档原来可以这么有趣!


💡 小贴士:这份指南本身就是用Markdown编写的,你可以查看源码学习更多技巧。

🔗 相关链接:

2023最新青龙面板薅羊毛教程【全过程】
在VScode中使用Babel ES6转ES5