Markdown 常用语法大全 📝

本指南详细介绍了 Markdown 的常用语法和高级用法，帮助您创建美观、结构清晰的文档。Markdown 是一种轻量级标记语言，易读易写，可以转换为有效的 HTML 文档。🚀

📖 导航目录

✨ 简介
🔤 基础文本格式化
📋 标题与分割线
📝 列表
🌐 链接与图片
💻 代码相关
📊 表格
💬 引用与注释
🚀 高级功能
🔧 HTML 嵌入
⚡ 转义字符
💡 实用技巧与最佳实践
🛠️ 工具推荐

✨ 简介 📖

Markdown 是一种轻量级标记语言，由 John Gruber 于 2004 年创建。它允许人们使用易读易写的纯文本格式编写文档，然后转换成有效的 HTML 文档。

主要特点：

📝 语法简单直观，学习曲线平缓
🔄 纯文本格式，兼容所有文本编辑器
🌐 可转换为 HTML、PDF 等多种格式
💼 广泛应用于文档编写、博客发布、笔记记录等场景
🆓 开源且免费使用

Markdown 示例

🔤 基础文本格式化 ✨

1. 粗体文本

1 2	粗体文本 __粗体文本__

示例效果：
粗体文本
粗体文本

2. 斜体文本

1 2	斜体文本 _斜体文本_

示例效果：
斜体文本
斜体文本

3. 粗斜体文本

1 2	*粗斜体文本* ___粗斜体文本___

示例效果：
粗斜体文本
粗斜体文本

4. 删除线

~~删除线文本~~

示例效果：
~~删除线文本~~

5. 文本高亮

1	<mark>高亮文本</mark>

示例效果：
高亮文本

6. 下标和上标

1 2	H<sub>2</sub>O E = mc<sup>2</sup>

示例效果：
H₂O
E = mc²

📋 标题与分割线 📋

1. 标题级别

# 一级标题
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题

2. 替代标题语法

一级标题
=========

二级标题
---------

3. 居中对齐标题

1	# <center>居中标题</center>

示例效果：

居中标题示例

4. 分割线

1
2
3

---
***
___

示例效果：

5. 带文本的分割线

1
2
3

[//]: # (---)
* * *
- - -

📝 列表 📝

1. 有序列表

1. 第一项
2. 第二项
3. 第三项
   1. 子项一
   2. 子项二

示例效果：

第一项
第二项
第三项
1. 子项一
2. 子项二

2. 无序列表

- 项目一
- 项目二
- 项目三
  - 子项目一
  - 子项目二

* 另一种方式
+ 又一种方式

示例效果：

项目一
项目二
项目三
- 子项目一
- 子项目二

3. 任务列表

1 2	- [ ] 未完成任务 - [x] 已完成任务

示例效果：

[ ] 未完成任务
[x] 已完成任务

4. 定义列表

术语一
:   定义一

术语二
:   定义二

示例效果：
术语一
: 定义一

术语二
: 定义二

🌐 链接与图片 🌐

1. 文字链接

1	[显示文本](链接地址 "提示文字")

示例效果：
百度搜索

2. 引用式链接

1
2
3

[显示文本][链接标识]

[链接标识]: https://example.com "可选标题"

3. 直接链接

1 2	<https://www.example.com> <email@example.com>

示例效果：
https://www.example.com
email@example.com

4. 图片嵌入

1	![图片描述](图片链接地址 "可选标题")

示例效果：
示例图片

5. 带链接的图片

1	[![图片描述](图片链接)](目标链接)

6. 图片大小调整

1	<img src="图片链接" alt="图片描述" width="200" height="100">

💻 代码相关 💻

1. 行内代码

`行内代码`

示例效果：
console.log("Hello World")

2. 代码块

1
2
3

```语言名称
代码内容
```

示例效果：

1
2
3

function hello() {
  console.log("Hello Markdown!");
}

3. 缩进代码块

1 2	缩进的代码块每行至少四个空格

4. 语法高亮支持的语言

javascript 或 js
python 或 py
html
css
java
php
sql
bash 或 sh
等等…

📊 表格 📊

1. 基础表格

| 列1 | 列2 | 列3 |
|-----|-----|-----|
| 数据1 | 数据2 | 数据3 |
| 数据4 | 数据5 | 数据6 |

示例效果：

年龄	班级	名字
18	二班	凡凡
18	三班	涵涵

2. 表格对齐

1
2
3

| 左对齐 | 居中对齐 | 右对齐 |
|:-------|:--------:|-------:|
| 数据左 | 数据中 | 数据右 |

示例效果：

左对齐	居中对齐	右对齐
左侧数据	中间数据	右侧数据

3. 复杂表格

| 项目 | 价格 | 数量 |
|------|-----:|:----:|
| 苹果 | \$1 | 5 |
| 香蕉 | \$2 | 3 |
| 总计 | \$11 | 8 |

💬 引用与注释 💬

1. 块引用

1
2
3

> 一级引用
>> 二级引用
>>> 三级引用

示例效果：

一级引用

二级引用

三级引用

2. 带来源的引用

1
2
3

> 这是一个精彩的引用。
> 
> — <cite>名人姓名</cite>

3. 注释

1 2	[//]: # (这是注释，不会显示) <!-- 这也是注释 -->

4. 脚注

1
2
3

这是一个带有脚注的文本[^1]。

[^1]: 这是脚注的内容。

示例效果：
这是一个带有脚注的文本¹。

¹. 这是脚注的内容。 ↩

🚀 高级功能 🚀

1. 自定义文本样式

1	<font face="黑体" color="#0099ff" size="4">自定义文本</font>

示例效果：

自定义文本

2. 颜色和大小示例

1
2
3

<font color=#FF6347 size=5>红色文字</font>
<font color=#0099ff size=3>蓝色文字</font>
<font color=#9ACD32 size=6>绿色文字</font>

示例效果：

红色文字蓝色文字绿色文字

3. 单选按钮

1 2	[radio color="blue" checked="checked"]选中项[/radio] [radio]未选中项[/radio]

示例效果：
[radio color=”blue” checked=”checked”]选中项[/radio]
[radio]未选中项[/radio]

4. 进度条

1	[progress value="75" max="100"]75%[/progress]

示例效果：
[progress value=”75” max=”100”]75%[/progress]

5. 折叠内容

<details>
<summary>点击展开详细内容</summary>

这里是隐藏的详细内容。

- 项目一
- 项目二
- 项目三
</details>

示例效果：

点击展开详细内容

这里是隐藏的详细内容。 - 项目一 - 项目二 - 项目三

🔧 HTML 嵌入 🌐

1. 嵌入视频

<iframe src="//player.bilibili.com/player.html" 
        width="100%" 
        height="600" 
        scrolling="no" 
        border="0" 
        frameborder="no" 
        framespacing="0" 
        allowfullscreen="true">
</iframe>

2. 嵌入音频

<audio controls>
  <source src="audio.mp3" type="audio/mpeg">
  您的浏览器不支持音频元素。
</audio>

3. 嵌入 PDF

1	<embed src="document.pdf" width="100%" height="600px" />

4. 按钮

1	<button onclick="alert('Hello!')">点击我</button>

示例效果：

⚡ 转义字符 🔧

1. 常用转义字符

\* 转义星号
\_ 转义下划线
\` 转义反引号
\\ 转义反斜杠
\[ 转义左方括号
\] 转义右方括号
\( 转义左圆括号
\) 转义右圆括号
\# 转义井号
\+ 转义加号
\- 转义减号
\. 转义句点
\! 转义感叹号

示例效果：
* 普通星号
_ 普通下划线
` 普通反引号
\ 普通反斜杠

2. HTML 实体

&amp; &amp;amp; 符号
&lt; &lt; 小于号
&gt; &gt; 大于号
&nbsp; 不间断空格
&copy; &copy; 版权符号

示例效果：
& & 符号
< < 小于号
> > 大于号

💡 实用技巧与最佳实践 💡

1. 文档结构建议

# 文档标题

## 简介
简要介绍文档内容

## 安装
### 前提条件
- 条件1
- 条件2

### 安装步骤
1. 步骤一
2. 步骤二

## 使用方法
### 基本用法
```代码示例```

### 高级用法
```高级代码示例```

## 常见问题
### 问题一
解决方案

## 参考链接
- [相关文档](链接)