【5分钟,带你迅速上手“Markdown”】

作者 :“码上有前”
文章简介 :5分钟快速上手
欢迎小伙伴们 点赞、收藏⭐、留言
比官网通俗易懂,清晰明了系列

5分钟,带你迅速上手“Markdown”

  • markdown标题语法
  • Markdown段落格式
  • Markdown的粗体斜体着重
  • Markdown的块引用
  • Markdown的有序与无序列表
      • 无序列表
      • 有序列表
      • 嵌套列表
  • Markdown的图片与代码
      • 插入图片
      • 插入代码块
  • Markdown的转义刻度线与链接
  • Markdown的网址、电子邮件地址和格式化链接
      • 插入网址
      • 插入电子邮件地址
      • 格式化链接
  • Markdown的表格
      • 创建表头
      • 添加数据行
      • 对齐表格内容
      • 合并单元格
  • Markdown的高级技巧
      • 1. 标题层级
      • 2. 引用文本
      • 3. 列表
      • 4. 粗体和斜体
      • 5. 分割线
      • 6. 插入图片
      • 7. 插入代码块
      • 8. 表格

markdown标题语法

在这里插入图片描述

Markdown 中的标题可以使用 # 符号来表示,具体的语法规则如下:

# 标题1
## 标题2
### 标题3
#### 标题4
##### 标题5
###### 标题6

其中,# 符号的数量代表标题的级别,从 1 到 6 依次减小,对应着 HTML 中的

。例如,# 表示一级标题,## 表示二级标题,依此类推。

你可以根据需要选择适当的标题级别来组织你的文档结构。标题的级别和样式在不同的 Markdown 解析器和渲染器中可能会有所不同,但一般情况下,使用 # 符号来表示标题是通用的做法。

Markdown段落格式

Markdown 中的段落格式可以通过以下方式实现:

  1. 换行:在两行文本之间插入一个空行即可创建一个新的段落。
这是第一个段落。

这是第二个段落。
  1. 换行符号:在一行文本的末尾添加两个或更多空格,然后按下回车键,即可创建一个新的段落。
这是第一个段落。  
这是第二个段落。
  1. 强制换行:如果你想在同一段落内创建一个换行,可以在行尾插入两个空格,然后按下回车键。
这是一行文本,  
这是同一段落内的另一行文本。

以上是常用的 Markdown 段落格式。注意,不同的 Markdown 解析器和渲染器可能会有略微的差异,但这些方法是通用的。你可以根据需要选择适合你的文档的段落格式。

Markdown的粗体斜体着重

在 Markdown 中,可以使用以下方式来表示粗体、斜体和着重:

  1. 粗体(Bold):使用两个星号 ** 或两个下划线 __ 将文本包围。

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

    示例输出: 粗体文本

  2. 斜体(Italic):使用一个星号 * 或一个下划线 _ 将文本包围。

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

    示例输出: 斜体文本

  3. 着重(Emphasis):使用一个星号 * 或一个下划线 _ 将文本包围。

    *着重文本*
    _着重文本_
    

    示例输出: 着重文本

需要注意的是,Markdown 的粗体、斜体和着重语法是对称的,即在起始和结束标记中的符号数量要一致。如果你的 Markdown 解析器支持,也可以使用双重符号(如 ****____)来表示更强调的粗体或斜体。

记住,在使用 Markdown 的不同平台和工具时,渲染效果可能会有所不同。因此,确保在编辑和预览文本时查看正确的样式。

Markdown的块引用

在 Markdown 中,你可以使用块引用(Blockquote)来引用他人的文字、引用文章或添加注释。块引用会给文本添加一个垂直条纹或缩进效果。

使用块引用的语法是在要引用的文本前面加上 > 符号,可以是单个符号或多个符号,表示不同层级的引用。每段引用可以有多行文本。

以下是块引用的示例:

> 这是一个块引用。
> 可以有多行文本。
> 块引用内的每一行都会被缩进。

示例输出:

这是一个块引用。
可以有多行文本。
块引用内的每一行都会被缩进。

你也可以在块引用中嵌套其他的块引用,只需添加更多的 > 符号即可。

> 这是一个块引用。
>
> > 这是一个嵌套的块引用。
> > 可以有多层嵌套。
>
> 继续原始的块引用。

示例输出:

这是一个块引用。

这是一个嵌套的块引用。
可以有多层嵌套。

继续原始的块引用。

块引用可以与其他 Markdown 元素一起使用,如标题、列表、代码块等,以创建更丰富的文档结构。

Markdown的有序与无序列表

在 Markdown 中,你可以使用有序列表和无序列表来组织和呈现项目或条目。

无序列表

无序列表使用连字符 -、加号 + 或星号 * 作为项目的标记符号,并在每个项目前面添加一个空格。

示例:

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

输出:

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

你可以混合使用不同的标记符号,它们都会被解析为无序列表。

示例:

- 项目1
+ 项目2
* 项目3

输出:

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

有序列表

有序列表使用数字后面加上英文句点或圆括号作为项目的标记符号,并在每个项目前面添加一个空格。

示例:

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

输出:

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

你可以根据需要在有序列表中使用任意的数字,它们会按照顺序进行排序。

示例:

5. 项目1
2. 项目2
9. 项目3

输出:

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

有序列表的数字可以不连续,Markdown 解析器会自动进行排序。

嵌套列表

无论是无序列表还是有序列表,你都可以在其中嵌套其他列表,只需在嵌套列表前添加更多的缩进。

示例:

- 项目1
  - 子项目1
  - 子项目2
- 项目2
  1. 子项目1
  2. 子项目2

输出:

  • 项目1
    • 子项目1
    • 子项目2
  • 项目2
    1. 子项目1
    2. 子项目2

通过使用无序列表和有序列表,你可以轻松创建项目和条目,使文档更加结构化和易读。

Markdown的图片与代码

在 Markdown 中,你可以插入图片和代码块来展示图片和代码。

插入图片

要在 Markdown 中插入图片,你可以使用以下语法:

![替代文本](图片链接)

其中,替代文本 是在图片无法加载时显示的文本描述,图片链接 是图片的 URL 或相对路径。

示例:

![示例图片](https://example.com/image.jpg)

你可以将图片链接替换为本地文件的路径,以插入本地图片。

插入代码块

要在 Markdown 中插入代码块,你可以使用以下语法:

使用三个反引号 ```包围代码块,并在开始的反引号后面指定代码块的语言(可选)。

示例:

```python
def greet():
    print("Hello, world!")

greet()
```

输出:

def greet():
    print("Hello, world!")

greet()

请注意,代码块语法支持多种编程语言,例如 pythonjavascriptjava 等。指定代码块语言有助于正确的语法高亮显示。

希望这些示例能帮助你在 Markdown 中插入图片和代码块。

Markdown的转义刻度线与链接

在 Markdown 中,如果你想要显示一条水平的转义刻度线(horizontal rule),可以使用三个或更多的连字符 -、星号 * 或下划线 _。以下是示例:

---
***
___

这将生成一条水平线,用于分隔段落或创建视觉上的分隔效果。

示例输出:




对于链接,在 Markdown 中可以使用以下语法来创建链接:

  1. 内联链接:使用方括号 [] 包围链接文本,紧接着使用圆括号 () 包围目标 URL。

    示例:

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

    输出:链接文本

  2. 引用链接:使用方括号 [] 包围链接文本,紧接着使用方括号 [] 包围链接标识符,链接标识符与具体的 URL 定义在文档的其他地方。

    示例:

    [链接文本][link-id]
    ...
    [link-id]: http://example.com
    

    输出:[链接文本][link-id]

    在文档的其他地方,你需要使用 [link-id]: http://example.com 定义链接标识符。

  3. 自动链接:如果你想要将一个 URL 或邮箱地址转换为链接,可以使用尖括号 <> 包围 URL 或邮箱地址。

    示例:

    
    
    

    输出:
    http://example.com
    mailto:[email protected]

以上是 Markdown 中转义刻度线和链接的语法示例。你可以根据需要使用合适的语法来插入转义刻度线和创建链接。

Markdown的网址、电子邮件地址和格式化链接

在 Markdown 中,你可以使用不同的方式来插入网址、电子邮件地址和格式化链接。

插入网址

要插入一个网址链接,你可以使用以下语法:

<网址>

示例:


输出:

https://example.com

插入电子邮件地址

要插入一个电子邮件地址链接,你可以使用以下语法:

<邮件地址>

示例:


输出:

[email protected]

格式化链接

如果你希望链接文本显示为自定义的文本,而不是显示完整的 URL 或电子邮件地址,你可以使用以下语法:

  1. 内联格式化链接:

    [链接文本](链接地址)
    

    示例:

    [OpenAI](https://openai.com)
    

    输出:

    OpenAI

  2. 引用格式化链接:

    [链接文本][链接标识符]
    
    [链接标识符]: 链接地址
    

    示例:

    [OpenAI][1]
    
    [1]: https://openai.com
    

    输出:

    OpenAI

以上是在 Markdown 中插入网址、电子邮件地址和格式化链接的示例。你可以根据需求选择适当的语法来创建链接并自定义链接文本的显示方式。

Markdown的表格

在 Markdown 中,你可以使用表格来展示结构化的数据。下面是创建表格的示例和语法:

创建表头

表头使用管道符 | 分隔不同的列,并在每个单元格中填写表头标题。你可以在表头下方使用连字符 - 来标识每列的对齐方式(可选)。

示例:

| 列1标题 | 列2标题 | 列3标题 |
| ------- | ------- | ------- |

输出:

列1标题 列2标题 列3标题

添加数据行

在表头下方的行中,使用管道符 | 分隔不同的列,并在每个单元格中填写对应的数据。

示例:

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

输出:

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

对齐表格内容

你可以通过在表头下方的连字符行中使用冒号 : 来指定每列的对齐方式。冒号可以放在左侧、右侧或两侧,分别表示左对齐、右对齐和居中对齐。

示例:

| 左对齐   | 右对齐   | 居中对齐 |
| :------ | ------: | :-----: |
| 值1     | 值2     |  值3    |
| 值4     | 值5     |  值6    |

输出:

左对齐 右对齐 居中对齐
值1 值2 值3
值4 值5 值6

合并单元格

如果你想要合并表格中的单元格,可以使用管道符 | 来跳过对应的单元格。

示例:

| 列1标题 | 列2标题 | 列3标题 |
| ------- | ------- | ------- |
| 值1     |         | 值3     |
| 值4     | 值5     |         |

输出:

列1标题 列2标题 列3标题
值1 值3
值4 值5

以上是在 Markdown 中创建表格的示例和语法。你可以根据需要调整表格的列数、添加表头、填写数据和对齐方式,以展示不同的表格结构。

Markdown的高级技巧

Markdown 提供了一些高级技巧,可以让你更好地控制文档的呈现方式。以下是一些常用的 Markdown 高级技巧:

1. 标题层级

Markdown 使用 # 符号表示标题,通过增加 # 的数量来指定标题的层级。最多可以使用六个 #,表示六级标题。

示例:

# 一级标题
## 二级标题
### 三级标题

2. 引用文本

使用 > 符号可以创建引用文本的效果。你可以在引用文本中嵌套使用多个 > 符号来创建多层引用。

示例:

> 这是引用的文本。
>
> > 这是嵌套的引用。

3. 列表

Markdown 支持有序列表和无序列表。

有序列表使用数字和点号来表示,无序列表使用 *+- 符号表示。

示例:

有序列表:
1. 第一项
2. 第二项
3. 第三项

无序列表:
- 项目1
- 项目2
- 项目3

4. 粗体和斜体

使用 ** 符号可以将文本设置为粗体,使用 *_ 符号可以将文本设置为斜体。

示例:

**粗体文本**
*斜体文本*

5. 分割线

使用三个或更多的连字符 -、星号 * 或下划线 _ 可以创建水平分割线。

示例:

---
***
___

6. 插入图片

使用 ![替代文本](图片链接) 的语法可以插入图片。替代文本是在图片无法加载时显示的文本描述。

示例:

![示例图片](https://example.com/image.jpg)

7. 插入代码块

使用三个反引号 ```包围代码块,并在开始的反引号后面指定代码块的语言(可选)。

示例:

```python
def greet():
    print("Hello, world!")

greet()
```

8. 表格

使用管道符 | 和连字符 - 创建表格。可以指定表头、对齐方式和合并单元格。

示例:

| 列1标题 | 列2标题 |
| ------- | ------- |
| 值1     | 值2     |

以上是一些 Markdown 的高级技巧示例。Markdown 还有其他一些扩展和技巧,你可以根据需要查阅更多资料来探索这些功能。
是不已经学会了?都看到这啦,点个赞吧

你可能感兴趣的:(前端,html)