MarkShareX 使用教程一:Markdown 完全指南

APP 0 次阅读
MarkShareX 使用教程一:Markdown 完全指南

适合人群:零基础小白、想提升文档质量的任何人、需要系统学习的开发者

读前须知:本教程包含 所有 Markdown 语法,从基础到进阶,配有大量实例和实用技巧。无需任何前置知识。

学习理由:MarkShareX 是完全基于 Markdown 格式的博客系统,学完本教程也就掌握了本系统精髓所在。


目录

  1. 什么是 Markdown?
  2. Markdown 的工作原理
  3. 基础语法
  4. 进阶语法
  5. 实用技巧
  6. 常用编辑器推荐
  7. Markdown 速查表
  8. 常见问题 FAQ

什么是 Markdown?

Markdown 是一种轻量级标记语言,由 John Gruber 于 2004 年创建。它的核心理念是:用纯文本编写,可读性强,能轻松转换为 HTML。

简单来说——你只需要在文字前后加几个符号,就能让它变成标题、粗体、列表、链接等格式,而原始文本依然清晰可读。

为什么用 Markdown?

优势 说明
📝纯文本 任何编辑器都能打开,永不担心格式丢失
👀可读性强 即使不渲染,原文也一目了然
🔄跨平台 GitHub、Notion、Obsidian、Typora、VS Code 全支持
专注写作 不用鼠标点来点去,手不离键盘
🌐Web 原生 天然输出 HTML,博客/文档首选
📦版本管理 Git diff 友好,适合团队协作

在哪里用 Markdown?

  • 📖 技术文档(GitHub README、Wiki、API 文档)
  • ✍️ 博客写作(Hugo、Hexo、Jekyll、WordPress)
  • 💬 即时通讯(Slack、Discord、钉钉、飞书部分支持)
  • 📝 笔记软件(Obsidian、Notion、Typora、Bear)
  • 🔧 项目管理(GitHub Issues、Jira、Linear)

Markdown 的工作原理

Markdown 文件(.md)经过 渲染器(Parser) 处理,转换为 HTML,再由浏览器展示。

┌─────────────┐      ┌──────────────┐      ┌─────────────┐
│  .md 文件   │ ──▶  │  Markdown    │ ──▶  │   HTML      │
│  (纯文本)    │      │  Parser      │      │  (所见即所得) │
└─────────────┘      └──────────────┘      └─────────────┘

常见 Parsermarked(JS)、comrak(Rust)、pulldown-cmark(Rust)、markdown-it(JS)、Goldmark(Go)


基础语法

以下语法在 所有 Markdown 环境中通用(遵循 CommonMark 标准)。

标题

使用 # 号标记标题级别,# 的数量 = 标题级别(1~6)。

# 一级标题(最大)
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题(最小)

渲染效果

一级标题

二级标题

三级标题

💡 技巧# 后需要加一个空格。大多数编辑器支持 Ctrl+1~6 快捷键设置标题级别。


段落与换行

  • 段落:文字之间空一行即为新段落
  • 强制换行:在行末加 两个空格 再回车
  • 软换行:直接回车(部分渲染器支持,不保证通用)
这是第一段。

这是第二段。(中间有空行)

这是同一段,  
但这里换行了。(行末两个空格 + 回车)

💡 技巧:不确定环境是否支持软换行时,统一用「行末两个空格」或 <br> 标签(见后文)。


文本强调

写法 效果 说明
**粗体** 粗体 双星号或双下划线
*斜体* 斜体 单星号或单下划线
***粗斜体*** 粗斜体 三星号
~~删除线~~ 删除线 双波浪线
==高亮== ==高亮== 双等号(部分渲染器支持)
行内代码 代码 反引号包裹
这是**粗体**,这是*斜体*,这是***粗斜体***。
这段文字~~已经过时~~。这段是==重点==。
变量 `count` 的值是 42。

💡 技巧_下划线_*星号* 在大多数环境中等价,但在文字中间使用时建议用星号(如 file_*name*),避免歧义。


列表

无序列表

使用 -*+ 开头:

- 苹果
- 香蕉
- 橘子
  • 苹果
  • 香蕉
  • 橘子

有序列表

使用 数字. 开头(数字会自动递增):

1. 第一步:准备食材
2. 第二步:热锅倒油
3. 第三步:翻炒出锅
  1. 第一步:准备食材
  2. 第二步:热锅倒油
  3. 第三步:翻炒出锅

嵌套列表

子列表前面加 4 个空格1 个 Tab

- 水果
    - 苹果
    - 香蕉
        - 进口香蕉
        - 本地香蕉
- 蔬菜
    1. 菠菜
    2. 白菜
  • 水果
    • 苹果
    • 香蕉
      • 进口香蕉
      • 本地香蕉
  • 蔬菜
    1. 菠菜
    2. 白菜

💡 技巧:列表符号(-)和文字之间要有空格。多级嵌套时子项缩进 4 个空格最稳妥。


链接

行内链接

[显示文字](https://example.com)
[显示文字](https://example.com "鼠标悬停提示")

GitHub

引用式链接

适合链接较多、需要重复引用的场景:

[GitHub][1] 和 [Google][2]

[1]: https://github.com
[2]: https://google.com

引用定义可以放在文档任意位置,不会在渲染结果中显示。

自动链接

直接把 URL 包在 <> 中:

<https://example.com>
<user@example.com>

图片

语法与链接类似,前面加 !

![替代文字](图片地址)
![替代文字](图片地址 "图片标题")
![Logo](https://example.com/logo.png)
![本地图片](./images/photo.jpg)

💡 技巧

  • 替代文字(alt text)在图片加载失败时显示,对无障碍访问也很重要。
  • 图片也可以用作链接:[![图片](img.png)](https://link.com)
  • GitHub 等平台支持直接拖拽图片到编辑框。

代码

行内代码

用一个反引号包裹:

用 `console.log()` 打印日志。

console.log() 打印日志。

代码块

用三个反引号(```)包裹,并指定语言获得语法高亮:

```python
def hello():
    print("Hello, Markdown!")

hello()
```
def hello():
    print("Hello, Markdown!")

hello()

常用语言标识pythonjavascripttypescriptrustgojavabashsqljsonyamlhtmlcssmarkdown 等。

💡 技巧

  • 代码块内需要显示反引号时,外面用更多反引号包裹(如 ``` 四个反引号包三个)。
  • diff 语言标识可以显示代码差异(+ 绿色新增、- 红色删除)。

引用

> 开头:

> 这是一段引用文字。
> 可以跨多行。
>
> —— 作者名

这是一段引用文字。 可以跨多行。

—— 作者名

嵌套引用

> 外层引用
>> 内层引用
>>> 第三层

外层引用

内层引用

第三层

引用中嵌套其他元素

> ### 标题在引用里
> - 列表项也可以
> - 另一个列表项
>
> ```python
> print("代码块也行")
> ```

标题在引用里

  • 列表项也可以
  • 另一个列表项
print("代码块也行")

分隔线

三个或更多的 -*_ 单独成行:

段落一

---
段落二

***
段落三

___
段落四

三个符号都可以,渲染效果相同。--- 最常用。


表格

| 左对齐 | 居中对齐 | 右对齐 |
| :--- | :---: | ---: |
| 单元格 | 单元格 | 单元格 |
| 数据 A | 数据 B | 数据 C |
左对齐 居中对齐 右对齐
单元格 单元格 单元格
数据 A 数据 B 数据 C

对齐规则

  • :--- = 左对齐
  • :---: = 居中
  • ---: = 右对齐
  • --- = 默认左对齐

💡 技巧:顶栏分隔线(|---|)必须有。对齐冒号写在分隔线里,不是表头里。


进阶语法

以下语法多数属于 GFM(GitHub Flavored Markdown) 或其他扩展,在主流平台(GitHub、VS Code、Typora)基本都支持,但部分老式渲染器可能不支持。

脚注

Markdown 由 John Gruber 创建[^1],后来 GitHub 推广了 GFM 标准[^2]。

[^1]: John Gruber 是 Daring Fireball 博客的作者。
[^2]: GFM = GitHub Flavored Markdown,2017 年成为 CommonMark 的扩展。

脚注定义可以放在文档任何位置,大多数渲染器会把它们集中到文末。


任务列表

在无序列表基础上加 [ ](未完成)或 [x](已完成):

- [x] 学习 Markdown 基础语法
- [x] 掌握表格和链接
- [ ] 学习数学公式渲染
- [ ] 完成一篇 Markdown 文章
  • 学习 Markdown 基础语法
  • 掌握表格和链接
  • 学习数学公式渲染
  • 完成一篇 Markdown 文章

GitHub Issues 中任务列表可以点击勾选,非常好用。


Emoji 表情

两种方式:

方式一:直接输入 Emoji(Windows: Win+. / Mac: Ctrl+Cmd+Space

方式二:使用短代码

:smile: :rocket: :+1: :heart: :fire: :tada:

😄 🚀 👍 ❤️ 🔥 🎉

GitHub、Slack、Discord 都支持短代码表情。


数学公式

使用 $ 包裹行内公式,$$ 包裹块级公式(LaTeX 语法):

行内公式:质能方程 $E = mc^2$ 是爱因斯坦提出的。

块级公式:

$$
\sum_{i=1}^{n} x_i = x_1 + x_2 + \cdots + x_n
$$

$$
\int_{0}^{\infty} e^{-x^2} dx = \frac{\sqrt{\pi}}{2}
$$

行内公式:$E = mc^2$

$$ \sum_{i=1}^{n} x_i = x_1 + x_2 + \cdots + x_n $$

支持平台:Typora、Obsidian、VS Code(需插件)、GitHub、Notion、Jupyter Notebook。

常用 LaTeX 命令速查

效果 写法
$x^2$ x^2
$x_i$ x_i
$\frac{a}{b}$ \frac{a}{b}
$\sqrt{x}$ \sqrt{x}
$\pm$ \pm
$\infty$ \infty
$\alpha$ \alpha
$\beta$ \beta
$\sum$ \sum
$\int$ \int

流程图与图表

GFM 支持 Mermaid 语法直接绘制流程图、时序图等(GitHub、GitLab、Notion 均支持):

```mermaid
graph TD
    A[开始] --> B{条件判断}
    B -->|是| C[执行操作]
    B -->|否| D[跳过]
    C --> E[结束]
    D --> E
```
graph TD
    A[开始] --> B{条件判断}
    B -->|是| C[执行操作]
    B -->|否| D[跳过]
    C --> E[结束]
    D --> E

Mermaid 支持多种图表类型

类型 用途 关键字
流程图 流程逻辑 graph TD / flowchart
时序图 API 交互 sequenceDiagram
类图 面向对象设计 classDiagram
甘特图 项目排期 gantt
饼图 数据占比 pie
状态图 状态切换 stateDiagram

内嵌 HTML

Markdown 语法覆盖不到的需求,可以直接写 HTML:

<p align="center">
  <strong>居中加粗文字</strong>
</p>

<details>
<summary>点击展开更多内容</summary>

这里是折叠起来的内容,适合放详细说明或大段代码。

```python
print("折叠区域内的代码块")

💡 技巧:Markdown 语法和 HTML 标签可以混合使用,但 HTML 块级标签内部的 Markdown 语法通常不会被解析(需在标签前后加空行,某些渲染器例外)。


定义列表

部分渲染器支持(如 Pandoc、PHP Markdown Extra):

术语 1
: 定义 1-1
: 定义 1-2

术语 2
: 定义 2

⚠️ GitHub 和 CommonMark 不支持此语法,会被当作普通段落。如需跨平台,用表格替代。


Markdown 变体

你可能会遇到几个"版本"的 Markdown:

变体 全称 说明
CommonMark 标准规范 定义了基本语法,不包含表格/脚注等
GFM GitHub Flavored Markdown GitHub 扩展:表格、任务列表、删除线、Mermaid
MDX Markdown + JSX 组件化 Markdown,React 生态常用
R Markdown R + Markdown R 语言生态,支持代码执行

日常写作中,GFM 是事实标准,覆盖了 95% 的场景。


实用技巧

转义字符

当你想显示 *#[ 等"语法符号"本身时,在前面加反斜杠 \

\*这不是斜体\*
\# 这不是标题
\`这不是代码\`

*这不是斜体* # 这不是标题

可转义符号

\  `  *  _  {  }  [  ]  (  )  #  +  -  .  !  |  ~  <  >

锚点与页内跳转

Markdown 标题自动生成 HTML id 属性(通常是标题文字的小写连字符形式),可用于页内跳转:

[跳转到实用技巧](#实用技巧)
[跳转到数学公式](#数学公式)

⚠️ 注意

  • 中文标题的 id 生成规则因渲染器而异。有的保留中文,有的转拼音,有的去掉所有非 ASCII 字符。
  • 最稳妥的做法是用 <a id="anchor"></a> 手动定义锚点。

手动锚点

<a id="custom-anchor"></a>

[点击跳转到自定义锚点](#custom-anchor)

自动生成目录

很多编辑器(Typora、VS Code、Obsidian)支持自动生成目录:

[TOC]
或
[[_TOC_]]

⚠️ 这不是 CommonMark 标准,不同平台语法不同,建议查阅所用编辑器的文档。


折叠内容

用 HTML 的 <details> 标签(GitHub、Notion 支持):

<details>
<summary>📌 点击查看详细代码</summary>

```
这里是大段代码,默认折叠。
展开后才会显示,避免页面太长。
```
</details>

这里是大段代码,默认折叠。 展开后才会显示,避免页面太长。


注释

Markdown 没有原生的注释语法,但可以用 HTML 注释:

正文内容
<!-- 这是注释,不会在渲染结果中出现 -->
正文继续

也利用链接引用做"注释"(因为引用定义不显示):

正文内容

[comment]: <> (这也是一种注释方式)
[//]: # (另一种变体)

多级嵌套

各种元素可以互相嵌套:

> **引用中的粗体**,包含 `代码` 和 [链接](url)。
>
> - 列表项
> - 另一个
>
>     ```python
>     print("引用中的代码块")
>     ```

1. 有序列表中的
   - 无序子列表
   - 包含 **粗体** 和 `代码`

- [ ] 任务列表中的 `行内代码` 和 [链接](url)

扩散链接(自动链接)

在 GFM 中,直接写 URL 会自动变成链接(不需要 <>):

Visit https://github.com for more info.

不需要任何标记。但邮件地址建议用 <> 包裹:<user@example.com>


表格对齐与格式化

表格内的格式

| 功能 | 语法 | 示例 |
| :--- | :--- | :--- |
| 粗体 | `**text**` | **重要** |
| 代码 | `` `code` `` | `count` |
| 链接 | `[text](url)` | [GitHub](https://github.com) |
| 图片 | `![alt](url)` | Logo |

表格单元格内可以使用大多数行内语法(粗体、斜体、代码、链接)。


行内 HTML 的高级用法

当 Markdown 无法满足需求时,直接使用 HTML:

这是一个<span style="color: red;">红色文字</span>的示例。

<kbd>Ctrl</kbd> + <kbd>C</kbd> 复制

<mark>高亮标记</mark>(比 ==高亮== 兼容性更好)

<sup>上标</sup>和<sub>下标</sub>

这是一个红色文字的示例。

Ctrl + C 复制


常用编辑器推荐

编辑器 平台 特点 适合人群
Typora Win/Mac/Linux 所见即所得,简洁美观 写作者
VS Code 全平台 免费、插件丰富、Git 集成 开发者
Obsidian 全平台 双向链接、图谱、本地优先 知识管理者
Notion Web/全平台 多合一协作 团队
iA Writer Mac/iOS 极致简洁、专注模式 极简主义者
MarkText Win/Mac/Linux 开源替代 Typora 开源爱好者
Ulysses Mac/iOS 专业写作出版 专业作者

💡 推荐:新手从 Typora 开始(安装即用),开发者在 VS Code 里写 Markdown 最方便。


Markdown 速查表

基础语法

元素 语法 效果
标题 # H1 ## H2 ### H3 1~6 级标题
粗体 **text** 粗体
斜体 *text* 斜体
粗斜体 ***text*** 粗斜体
删除线 ~~text~~ 删除
无序列表 - item • 列表
有序列表 1. item 1. 列表
链接 [text](url) 超链接
图片 ![alt](url) 嵌入图片
行内代码 `code` code
代码块 ``` 代码块
引用 > text 块引用
分隔线 --- 水平线
表格 ` a

进阶语法

元素 语法 支持环境
任务列表 - [x] item GFM
脚注 [^1] GFM
Emoji :smile: GFM
数学公式 $E=mc^2$ LaTeX 支持
HTML <tag> 通用
折叠 <details> GFM
Mermaid ```mermaid GFM

常见问题 FAQ

Q: Markdown 文件用什么扩展名? A: .md.markdown.md 最常见。

Q: 不同平台的 Markdown 语法一样吗? A: 基础语法(标题、粗体、列表、链接)都一样。进阶语法(表格、脚注、Mermaid)取决于平台是否支持 GFM 扩展。

Q: 如何预览 Markdown? A: VS Code 按 Ctrl+Shift+V;Typora 直接所见即所得;macOS 可以用 brew install qlmarkdown 启用快速预览。

Q: Markdown 可以转换为 PDF 吗? A: 可以。Typora、VS Code 插件(Markdown PDF)、Pandoc 命令行工具都可以。

Q: 图片太大怎么处理? A: 用 HTML 的 <img> 标签指定宽高:<img src="url" width="400">

Q: 如何在 Markdown 里写表格的 | 字符? A: 用 \| 转义,或在表格单元格中使用 | 直接写(部分渲染器支持)。


📌 结语:Markdown 就像用键盘给文字"化妆"——几个简单的符号,就能让纯文本变得结构清晰、格式美观。掌握本教程的内容,你已经可以应对 95% 以上的 Markdown 写作场景了。剩下的 5%,在遇到具体问题时查阅文档即可。

推荐下一步:打开你的编辑器,把这篇教程里的例子逐一手打一遍——动手是学习 Markdown 最快的方式。