首页 教程 Web前端 Markdown 语法大全详解

Markdown 语法大全详解

Markdown 语法大全详解

Markdown是一种轻量级标记语言,排版语法简洁,让人们更多地关注内容本身而非排版。它使用易读易写的纯文本格式编写文档,可与HTML混编,可导出 HTML、PDF 以及本身的 .md 格式的文件。因简洁、高效、易读、易写,Markdown被大量使用,如Github、Wikipedia、简书等。

1. 样式标题

Markdown 支持使用 # 符号来创建不同级别的标题。# 符号的数量代表了标题的级别。

# 这是 H1 标题 ## 这是 H2 标题 ### 这是 H3 标题 #### 这是 H4 标题 ##### 这是 H5 标题 ###### 这是 H6 标题

这是 H1 标题

这是 H2 标题

这是 H3 标题

这是 H4 标题
这是 H5 标题
这是 H6 标题

不同的 Markdown 应用程序处理 # 和标题之间的空格方式并不一致。为了兼容考虑,请用一个空格在 # 和标题之间进行分隔。

2. 段落

段落由一行或多行文本组成,每段之间需要有一个空行隔开。

这是一个段落。它可以包含多个句子。 这是另一个段落。

这是一个段落。它可以包含多个句子。

这是另一个段落。

3. 强调

用于突出显示文本。

斜体

*斜体文本* 或 _斜体文本_

斜体文本斜体文本

粗体

**粗体文本** 或 __粗体文本__

粗体文本粗体文本

斜体和粗体

***斜体加粗文本*** 或 ___斜体加粗文本___

斜体加粗文本斜体加粗文本

4. 列表

列表分为有序列表和无序列表。

无序列表

- 项目 1 - 项目 2 - 项目 3

  • 项目 1
  • 项目 2
  • 项目 3

有序列表

1. 项目 1 2. 项目 2 3. 项目 3

  1. 项目 1
  2. 项目 2
  3. 项目 3

嵌套列表

- 项目 1 - 项目 2 - 子项目 1 - 子项目 2 - 项目 3

  • 项目 1
  • 项目 2
    • 子项目 1
    • 子项目 2
  • 项目 3

5. 链接

链接可以指向网页或者文件。

[链接文本](https://example.com)

链接文本

6. 图像

插入图像也很简单 这张图片好像没法加载…

![替代文字](https://imagepphcloud.thepaper.cn/pph/image/126/870/199.jpg)

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-B0zSBx1M-1722265538317)(https://imagepphcloud.thepaper.cn/pph/image/126/870/199.jpg)]

7. 代码

内联代码

`内联代码`

内联代码

代码块

\```\n 代码块\n ````\n

代码块

8. 表格

表格可以帮助组织数据。

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

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

9. 水平线

水平线用于分隔不同的部分。

---


10. 引用

引用通常用于展示原文。

> 这是一个引用。

这是一个引用。

11. 删除线

~~被删除的文字~~

被删除的文字

12. 任务列表

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

  • 未完成的任务
  • 已完成的任务

13. 数学公式

Markdown 本身不支持数学公式,但许多Markdown编辑器支持使用 LaTeX 格式来插入数学公式。

行内公式

$E = mc^2$

E = m c 2 E = mc^2 E=mc2

独立公式

$$ E = mc^2 $$

E = m c 2 E = mc^2 E=mc2

14. 脚注

脚注可以用来添加额外的信息或引用。

这里有一个脚注[^1]。 [^1]: 这是脚注的内容。

这里有一个脚注1

15. 定义列表

定义列表用于定义术语或概念。

名词: : 定义 : 更多解释

名词:
定义
更多解释

16. 代码高亮

对于代码块,可以通过指定语言来实现语法高亮。

\```\n ```python def hello_world(): print("Hello, world!") ````\n

defhello_world():print("Hello, world!")

17. 表格对齐

有些Markdown编辑器支持表格中的单元格对齐方式。

| 左对齐 | 居中对齐 | 右对齐 | | :---- | :-----: | ----: | | 文本 | 文本 | 文本 | | 文本 | 文本 | 文本 |

左对齐居中对齐右对齐
文本文本文本
文本文本文本

18. YAML 前置元数据

Markdown 文件有时会包含YAML格式的前置元数据,用于存储文件的相关信息。

--- title: 我的文章标题 author: John Doe date: 2024-07-29 --- # 开始正文


title: 我的文章标题
author: John Doe
date: 2024-07-29

开始正文

18. 高级数学公式

一些Markdown编辑器支持使用LaTeX语法来编写更复杂的数学公式。

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

∫ − ∞ + ∞ e − x 2 d x = π \int_{-\infty}^{+\infty} e^{-x^2} dx = \sqrt{\pi} +ex2dx=π

19.嵌套引用

将两个引用嵌套起来

> 这是一个引用。 > > 这是一个嵌套引用。

这是一个引用。

这是一个嵌套引用。

20. 转义字符

在Markdown中,如果想要显示某些特殊字符而不是让它们被解析为Markdown语法的一部分,可以使用反斜杠 \ 来转义这些字符。

转义字符示例

  • 反斜杠 (\)

    \\

    \

  • 星号 (*)

    \*

    *

  • 下划线 (_)

    \_

    _

  • 大括号 ({}) 和方括号 ([])

    \{ \} \[ \]

    { } [ ]

  • 尖括号 (<>)

    \< \>

    < >

  • 竖线 (|)

    \|

    |

  • 反引号 (``)

    \`

    `

  • 井号 (#)

    \#

    #

  • 减号 (-)

    \-

    -

  • 点 (.) 和感叹号 (!)

    \. \!

    . !

  • 其他特殊字符:例如美元符号 $、百分号 % 等,通常不需要转义,除非在某些特定情况下(如数学公式)需要使用。

示例

假设你想在一个段落中显示星号 * 和下划线 _ 而不是让它们被解析为斜体,你可以这样写:

这不是 * 斜体文本 *,也不是 _ 下划线文本 _。

这不是 * 斜体文本 *,也不是 _ 下划线文本 _。

显示结果:

这不是 * 斜体文本 *,也不是 _ 下划线文本 _。

注意

  • 在某些情况下,如使用星号或下划线时,只有当它们位于单词边界时才需要转义。例如,在单词中间的下划线或星号通常不需要转义。
  • 当使用代码块时,通常不需要转义内部的特殊字符。
  • 对于某些Markdown编辑器,你可能需要转义两次才能正确显示转义字符,例如 \\ 显示为 \

21. 内嵌 HTML 标签

在 Markdown 中,任何有效的 HTML 标签都可以直接使用,而不会被 Markdown 解析器特别处理。这意味着你可以使用 HTML 来添加额外的样式或功能,例如 CSS 类、id、表格样式等。

示例

基本 HTML 标签

<b>加粗文本</b> <i>斜体文本</i> <em>强调文本</em> <strong>强烈强调文本</strong> <small>小字体文本</small>

加粗文本
斜体文本
强调文本
强烈强调文本
小字体文本

使用 CSS 类

<p class="highlight">这是一个带有 CSS 类的段落。</p>

这是一个带有 CSS 类的段落。

使用 CSS id

<p id="my-id">这是一个带有 CSS id 的段落。</p>

这是一个带有 CSS id 的段落。

使用 CSS 样式

<p style="color: red;">这是一个带有内联样式的段落。</p>

这是一个带有内联样式的段落。

使用表格

<table> <tr> <th>标题 1</th> <th>标题 2</th> </tr> <tr> <td>数据 1</td> <td>数据 2</td> </tr> </table>

标题 1标题 2
数据 1数据 2
使用 div

<div class="container"> <p>这是 div 内部的段落。</p> </div>

这是 div 内部的段落。

使用 span

<span class="important">这是重要的文本。</span>

这是重要的文本。

使用图像

<img src="/uploads/csdn/0e65772dba13744e4de22ae1c250d1a0.png" alt="示例图像" title="这是示例图像"> Markdown 语法大全详解

使用锚点

<a href="https://example.com" target="_blank">访问示例网站</a>

访问示例网站

使用列表

<ul> <li>列表项 1</li> <li>列表项 2</li> </ul>

  • 列表项 1
  • 列表项 2
使用注释

<!-- 这是一个 HTML 注释 -->

22. 甘特图

Markdown 本身不支持直接绘制甘特图,但你可以使用Mermaid这样的工具来在Markdown文档中生成甘特图。Mermaid 是一种基于Markdown的图表生成工具,支持甘特图等多种图表。

甘特图示例

gantt dateFormat YYYY-MM-DD title Adding GANTT diagram functionality to mermaid section 现有任务 已完成 :done, des1, 2014-01-06,2014-01-08 进行中 :active, des2, 2014-01-09, 3d 计划中 : des3, after des2, 5d

这段代码将生成一个简单的甘特图。

  • 2014-01-06
  • 2014-01-07
  • 2014-01-08
  • 2014-01-09
  • 2014-01-10
  • 2014-01-11
  • 2014-01-12
  • 2014-01-13
  • 2014-01-14
  • 2014-01-15
  • 2014-01-16
  • 2014-01-17 已完成 进行中 计划中 现有任务
  • Adding GANTT diagram functionality to mermaid
  • 23. UML 图

    Mermaid 同样支持多种UML图,包括类图、序列图、活动图等。

    类图示例

    sequenceDiagram 张三 ->> 李四: 你好!李四, 最近怎么样? 李四-->>王五: 你最近怎么样,王五? 李四--x 张三: 我很好,谢谢! 李四-x 王五: 我很好,谢谢! Note right of 王五: 李四想了很长时间, 文字太长了<br/>不适合放在一行. 李四-->>张三: 打量着王五... 张三->>王五: 很好... 王五, 你怎么样?

    这段代码将生成一个简单的类图。

    张三

  • 李四
  • 王五

    你好!李四, 最近怎么样?

  • 你最近怎么样,王五?
  • 我很好,谢谢!
  • 我很好,谢谢!
  • 李四想了很长时间, 文字太长了 不适合放在一行. 打量着王五...
  • 很好... 王五, 你怎么样?
  • 张三 李四 王五
  • 24. flow 流程图

    Mermaid 支持多种图表类型,其中流程图是非常常用的一种。

    lowchat st=>start: 开始 e=>end: 结束 op=>operation: 我的操作 cond=>condition: 确认? st->op->cond cond(yes)->e cond(no)->op

    流程图示例

    这段代码将生成一个简单的流程图。

    Created with Raphaël 2.3.0 开始 我的操作

    确认? 结束

    yes

    no

    25. Mermaid 类图

    Mermaid 支持绘制类图,可以用来表示类之间的关系。

    graph LR A[长方形] -- 链接 --> B((圆)) A --> C(圆角长方形) B --> D{菱形} C --> D

    «interface»
    Class01
    int chimp
    int gorilla
    size()
    AveryLongClass
    Class09
    C2
    C3
    Class07
    Object[] elementData
    equals()
    Class10
    >>service>>
    int id
    size()

    1. 这是脚注的内容。 ↩︎

    评论(0)条

    提示:请勿发布广告垃圾评论,否则封号处理!!

      猜你喜欢
      【MySQL】用户管理

      【MySQL】用户管理

       服务器/数据库  2个月前  2.15k

      我们推荐使用普通用户对数据的访问。而root作为管理员可以对普通用户对应的权限进行设置和管理。如给张三和李四这样的普通用户权限设定后。就只能操作给你权限的库了。

      Cursor Rules 让开发效率变成10倍速

      Cursor Rules 让开发效率变成10倍速

       服务器/数据库  2个月前  1.21k

      在AI与编程的交汇点上,awesome-cursorrules项目犹如一座灯塔,指引着开发者们驶向更高效、更智能的编程未来。无论你是经验丰富的老手,还是刚入行的新人,这个项目都能为你的编程之旅增添一抹亮色。这些规则文件就像是你私人定制的AI助手,能够根据你的项目需求和个人偏好,精确地调教AI的行为。突然间,你会发现AI不仅能理解Next.js的最佳实践,还能自动应用TypeScript的类型检查,甚至主动提供Tailwind CSS的类名建议。探索新的应用场景,推动AI辅助编程的边界。

      探索Django 5: 从零开始,打造你的第一个Web应用

      探索Django 5: 从零开始,打造你的第一个Web应用

       服务器/数据库  2个月前  1.12k

      Django 是一个开放源代码的 Web 应用程序框架,由 Python 写成。它遵循 MVT(Model-View-Template)的设计模式,旨在帮助开发者高效地构建复杂且功能丰富的 Web 应用程序。随着每个版本的升级,Django 不断演变,提供更多功能和改进,让开发变得更加便捷。《Django 5 Web应用开发实战》集Django架站基础、项目实践、开发经验于一体,是一本从零基础到精通Django Web企业级开发技术的实战指南《Django 5 Web应用开发实战》内容以。

      MySQL 的mysql_secure_installation安全脚本执行过程介绍

      MySQL 的mysql_secure_installation安全脚本执行过程介绍

       服务器/数据库  2个月前  1.08k

      mysql_secure_installation 是 MySQL 提供的一个安全脚本,用于提高数据库服务器的安全性

      【MySQL基础篇】概述及SQL指令:DDL及DML

      【MySQL基础篇】概述及SQL指令:DDL及DML

       服务器/数据库  2个月前  482

      数据库是长期存储在计算机内的、有组织的、可共享的、统一管理的大量数据的集合。数据库不仅仅是数据的简单堆积,而是遵循一定的规则和模式进行组织和管理的。数据库中的数据可以包括文本、数字、图像、音频等各种类型的信息。

      Redis中的哨兵(Sentinel)

      Redis中的哨兵(Sentinel)

       服务器/数据库  2个月前  308

      ​ 上篇文章我们讲述了Redis中的主从复制(Redis分布式系统中的主从复制-CSDN博客),本篇文章针对主从复制中的问题引出Redis中的哨兵,希望本篇文章会对你有所帮助。