Markdown使用说明
亲爱的小伙伴们，听说你们想了解Markdown的故事吗？那我就给大家讲一个轻松愉快的故事吧！
很久很久以前，有一个名叫John Gruber的程序员，他每天都要写很多技术文档，但排版格式实在是太麻烦了。于是他决定发扬自己的光和热，用自己的智慧创造出一种简单易学、方便好用的排版语言——Markdown！
Markdown和传统的HTML标记不同，一些复杂的元素都可以通过简单的符号来表示。就像是“#”这个井号，它可以代表不同级别的标题；“*”和“_”就是Markdown的重点强调工具，可以让你的文本变得更加醒目生动。
Markdown还非常贴心，它知道程序员们最珍视的两种东西：时间和精力。所以，你只需要一些简单的符号，它就会帮你完成排版，让你不再为无尽的标签而烦恼。
还有，Markdown非常人性化！它的语法规则像一只聪明机灵的小精灵，指导你去写出结构清晰、排版美观的文档。即使你是一个新手，也能够很快地跟上步伐，轻松愉快地玩转Markdown。
所以呐，小伙伴们，如果你们还在为文档排版烦恼，千万别错过Markdown这个好帮手哦！它简单、实用，而且免费——就像是一颗闪耀的黑钻石，让你的文档变得更加精美动人！
!> 这是一个 MarkDown 教学
标题
效果
标题 1
标题 2
标题 3
标题 4
标题 5
标题 6
Markdown
# 标题 1
## 标题 2
### 标题 3
#### 标题 4
##### 标题 5
###### 标题 6Mermaid
效果
flowchart LR
Start --> StopMarkdown
flowchart LR
Start --> StopLatex
效果
公式公式
Hello Equations!
When , there are two solutions to and they are
Maxwell's Equations
| equation | description |
|---|---|
| divergence of is zero | |
| curl of is proportional to the rate of change of | |
| wha? |
Markdown
公式$\sqrt{3x-1}+(1+x)^2$公式
# Hello Equations!
When $a \ne 0$, there are two solutions to $(ax^2 + bx + c = 0)$ and they are
$$ x = {-b \pm \sqrt{b^2-4ac} \over 2a} $$
## Maxwell's Equations
| equation | description |
| ---------------------------- | ----------------------------- |
| $\nabla \cdot \vec{\mathbf{B}} = 0$ | divergence of $\vec{\mathbf{B}}$ is zero |
| $\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} = \vec{\mathbf{0}}$ | curl of $\vec{\mathbf{E}}$ is proportional to the rate of change of $\vec{\mathbf{B}}$ |
| $\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} = \frac{4\pi}{c}\vec{\mathbf{j}} \nabla \cdot \vec{\mathbf{E}} = 4 \pi \rho$ | _wha?_Text
效果
Body text
Bold text
Italic text
Strikethrough
Marked text
preformatted text
Small Text
This is subscripe
This is superscript
Markdown
Body text
**Bold text**
*Italic text*
~~Strikethrough~~
<mark>Marked text</mark>
<pre>preformatted text</pre>
<small>Small Text</small>
This is <sub>subscript</sub>
This is <sup>superscript</sup>Links
效果
Markdown
[Inline link](https://google.com)
[Inline link with title](https://google.com "Google")
[Reference link by name][link1]
[Reference link by number][1]
[Reference link by self]
[link1]: https://google.com
[1]: https://google.com
[Reference link by self]: https://google.comLists
效果
Ordered Lists
- Ordered 1
- Ordered 2
- Ordered 2a
- Ordered 2b
- Ordered 2c
- Ordered 3
Unordered Lists
- Unordered 1
- Unordered 2
- Unordered 2a
- Unordered 2b
- Unordered 2c
- Unordered 3
Task Lists
- [x] Task 1
- [ ] Task 2
- [x] Subtask A
- [ ] Subtask B
- [ ] Task 3
Markdown
**Ordered Lists**
1. Ordered 1
1. Ordered 2
1. Ordered 2a
1. Ordered 2b
1. Ordered 2c
1. Ordered 3
**Unordered Lists**
- Unordered 1
- Unordered 2
- Unordered 2a
- Unordered 2b
- Unordered 2c
- Unordered 3
**Task Lists**
- [x] Task 1
- [ ] Task 2
- [x] Subtask A
- [ ] Subtask B
- [ ] Task 3Blockquotes
效果
横空出世，莽昆仑，阅尽人间春色。
飞起玉龙三百万，搅得周天寒彻。
- 教员
Markdown
> 横空出世，莽昆仑，阅尽人间春色。
> 飞起玉龙三百万，搅得周天寒彻。
>
> `- 教员`Code
效果
This is inline code
const add = (num1, num2) => num1 + num2;
const total = add(1, 2);
console.log(total); // 3<body>
<p>Hello</p>
</body>Markdown
This is `inline code`
```javascript
const add = (num1, num2) => num1 + num2;
const total = add(1, 2);
console.log(total); // 3
```
```html
<body>
<p>Hello</p>
</body>
```Notices
效果
!> Important 重要提醒
?> Tip 提示建议
Markdown
!> **Important** 重要提醒
?> **Tip** 提示建议Tabs
效果
English
Hello!
French
Bonjour!
Italian
Ciao!
MarkDown
<!-- tabs:start -->
#### **English**
Hello!
#### **French**
Bonjour!
#### **Italian**
Ciao!
<!-- tabs:end -->Tables
效果
| 表头A | 表头B | 表头C |
|---|---|---|
| 内容居左 | 内容居中 | 内容居右 |
| 内容居左 | 内容居中 | 内容居右 |
Markdown
| 表头A | 表头B | 表头C |
| :------- | :------: | -------: |
| 内容居左 | 内容居中 | 内容居右 |
| 内容居左 | 内容居中 | 内容居右 |Keyboard
效果
↑ Arrow Up
↓ Arrow Down
← Arrow Left
→ Arrow Right
⇪ Caps Lock
⌘ Command
Markdown
<kbd>↑</kbd> Arrow Up
<kbd>↓</kbd> Arrow Down
<kbd>←</kbd> Arrow Left
<kbd>→</kbd> Arrow Right
<kbd>⇪</kbd> Caps Lock
<kbd>⌘</kbd> CommandHorizontal Rule
效果
Markdown
---Images
效果
Inline-style
Reference-style
Markdown
**Inline**
**Reference**
![alt text][logo]
[logo]:https://vitejs.cn/logo.svg "My Blog"Emoji
A complete list is available here ===> Emoji Cheat Sheet
效果
:bowtie: 😄 😆 😊 😃 ☺️ 😏 😍 😘 😚 😳 😌 😆 😁 😉 😜 😝 😀 😗 😙 😛 😴 😟 😦 😧 😮 😬 😕 😯 😑 😒 😅 😓 😥 😩 😔 😞 😖 😨 😰 😣 😢 😭 😂 😲 😱 :neckbeard: 😫 😠 😡 😤 😪 😋 😷 😎 😵 👿 😈 😐 😶 😇 👽 💛 💙 💜 ❤️ 💚 💔 💓 💗 💕 💞 💘 💖 ✨ ⭐ 🌟
Markdown
:bowtie:
:smile:
:laughing:
:blush:
:smiley:
:relaxed:
:smirk:
:heart_eyes:
:kissing_heart:
:kissing_closed_eyes:
:flushed:
:relieved:
:satisfied:
:grin:
:wink:
:stuck_out_tongue_winking_eye:
:stuck_out_tongue_closed_eyes:
:grinning:
:kissing:
:kissing_smiling_eyes:
:stuck_out_tongue:
:sleeping:
:worried:
:frowning:
:anguished:
:open_mouth:
:grimacing:
:confused:
:hushed:
:expressionless:
:unamused:
:sweat_smile:
:sweat:
:disappointed_relieved:
:weary:
:pensive:
:disappointed:
:confounded:
:fearful:
:cold_sweat:
:persevere:
:cry:
:sob:
:joy:
:astonished:
:scream:
:neckbeard:
:tired_face:
:angry:
:rage:
:triumph:
:sleepy:
:yum:
:mask:
:sunglasses:
:dizzy_face:
:imp:
:smiling_imp:
:neutral_face:
:no_mouth:
:innocent:
:alien:
:yellow_heart:
:blue_heart:
:purple_heart:
:heart:
:green_heart:
:broken_heart:
:heartbeat:
:heartpulse:
:two_hearts:
:revolving_hearts:
:cupid:
:sparkling_heart:
:sparkles:
:star:
:star2:Alerts
效果
NOTE
An alert of type 'note' using global style 'callout'.
TIP
An alert of type 'tip' using global style 'callout'.
WARNING
An alert of type 'warning' using global style 'callout'.
[!ATTENTION] An alert of type 'attention' using global style 'callout'.
Markdown
> [!NOTE]
> An alert of type 'note' using global style 'callout'.
> [!TIP]
> An alert of type 'tip' using global style 'callout'.
> [!WARNING]
> An alert of type 'warning' using global style 'callout'.
> [!ATTENTION]
> An alert of type 'attention' using global style 'callout'.Summary
效果
我的列表(点击打开/折叠)
- 123
- abc
Markdown
<details>
<summary>我的列表(点击打开/折叠)</summary>
- 123
- abc
</details>References