Loading... "Markdown" is about two things: 1. a plain text formatting syntax; 2. a software tool, that converts the plain text formatting to others. ## 标题 ```markdown # 一级标题 ## 二级标题 ### 三级标题 #### 四级标题 ##### 五级标题 ###### 六级标题 ``` <div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-f1880df999dde1a7d6023d2b3358708212" aria-expanded="true"><div class="accordion-toggle"><span>标题</span> <i class="pull-right fontello icon-fw fontello-angle-right"></i> </div> </div> <div class="panel-body collapse-panel-body"> <div id="collapse-f1880df999dde1a7d6023d2b3358708212" class="collapse collapse-content"><p></p> # 一级标题 ## 二级标题 ### 三级标题 #### 四级标题 ##### 五级标题 ###### 六级标题 <p></p></div></div></div> ## 字体 ```markdown *斜体文本* _斜体文本_ **粗体文本** **粗体文本** ***粗斜体文本*** **_粗斜体文本_** ``` <div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-6aefe111aa6b6a4d73a0181298da280c19" aria-expanded="true"><div class="accordion-toggle"><span>字体</span> <i class="pull-right fontello icon-fw fontello-angle-right"></i> </div> </div> <div class="panel-body collapse-panel-body"> <div id="collapse-6aefe111aa6b6a4d73a0181298da280c19" class="collapse collapse-content"><p></p> *斜体文本* _斜体文本_ **粗体文本** **粗体文本** ***粗斜体文本*** **_粗斜体文本_** <p></p></div></div></div> ## 分隔线 ```markdown --- *** ``` <div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-390fa4d93fa42011c2376fb2d8fe888721" aria-expanded="true"><div class="accordion-toggle"><span>分隔线</span> <i class="pull-right fontello icon-fw fontello-angle-right"></i> </div> </div> <div class="panel-body collapse-panel-body"> <div id="collapse-390fa4d93fa42011c2376fb2d8fe888721" class="collapse collapse-content"><p></p> --- --- <p></p></div></div></div> ## 删除线 ```markdown RUNOOB.COM GOOGLE.COM ~~BAIDU.COM~~ ``` <div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-ea04d5cbd23d683ea6fb935715d6365e69" aria-expanded="true"><div class="accordion-toggle"><span>删除线</span> <i class="pull-right fontello icon-fw fontello-angle-right"></i> </div> </div> <div class="panel-body collapse-panel-body"> <div id="collapse-ea04d5cbd23d683ea6fb935715d6365e69" class="collapse collapse-content"><p></p> RUNOOB.COM GOOGLE.COM ~~BAIDU.COM~~ <p></p></div></div></div> ## 脚注 ```markdown 创建脚注格式类似这样 [^runoob]。 [^runoob]: 这是脚注 ``` 创建脚注格式类似这样 [^runoob]。 ## 列表 效果一致 ```markdown - 第一项 * 第二项 - 第三项 1. 第一项 2. 第二项 3. 第三项 ``` <div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-fbf07372eb212117e5a2e8b2f354bb1467" aria-expanded="true"><div class="accordion-toggle"><span>列表</span> <i class="pull-right fontello icon-fw fontello-angle-right"></i> </div> </div> <div class="panel-body collapse-panel-body"> <div id="collapse-fbf07372eb212117e5a2e8b2f354bb1467" class="collapse collapse-content"><p></p> - 第一项 * 第二项 - 第三项 1. 第一项 2. 第二项 3. 第三项 <p></p></div></div></div> 列表嵌套只需在子列表中的选项前面添加四个空格即可: ```markdown 4. 第一项: - 第一项嵌套的第一个元素 - 第一项嵌套的第二个元素 5. 第二项: - 第二项嵌套的第一个元素 - 第二项嵌套的第二个元素 ``` <div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-d189ed7c9cb210a5847209bbd052d33748" aria-expanded="true"><div class="accordion-toggle"><span>嵌套列表</span> <i class="pull-right fontello icon-fw fontello-angle-right"></i> </div> </div> <div class="panel-body collapse-panel-body"> <div id="collapse-d189ed7c9cb210a5847209bbd052d33748" class="collapse collapse-content"><p></p> 4. 第一项: - 第一项嵌套的第一个元素 - 第一项嵌套的第二个元素 5. 第二项: - 第二项嵌套的第一个元素 - 第二项嵌套的第二个元素 <p></p></div></div></div> ## 任务列表 ```markdown - [x] @mentions, #refs, [links](), **formatting**, and <del>tags</del> supported - [x] list syntax required (any unordered or ordered list supported) - [x] this is a complete item - [ ] this is an incomplete item ``` 这里好像不支持 GFM,具体情况可以查阅 [https://github.github.com/gfm/](https://github.github.com/gfm/) ## 区块 ```markdown > 最外层 > > > 第一层嵌套 > > > > > 第二层嵌套 > 区块中使用列表 > > 1. 第一项 > 2. 第二项 > - 第一项 > - 第二项 > - 第三项 - 第一项 > Markdown 是很酷的怨言 > 学的不仅是技术更是梦想 - 第二项 ``` <div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-a96707763073b3a1cdf5a44930d7ea6312" aria-expanded="true"><div class="accordion-toggle"><span>区块</span> <i class="pull-right fontello icon-fw fontello-angle-right"></i> </div> </div> <div class="panel-body collapse-panel-body"> <div id="collapse-a96707763073b3a1cdf5a44930d7ea6312" class="collapse collapse-content"><p></p> > 最外层 > > > 第一层嵌套 > > > > > 第二层嵌套 > 区块中使用列表 > > 1. 第一项 > 2. 第二项 > - 第一项 > - 第二项 > - 第三项 - 第一项 > Markdown 是很酷的怨言 > 学的不仅是技术更是梦想 - 第二项 <p></p></div></div></div> ## 代码 如果是段落上的一个函数或片段的代码可以用反引号把它包起来,例如:\`printf()\` `printf()` 也可以用用 4 个空格或者一个制表符(Tab 键)来指定一个代码块。 ```markdown echo 'game' echo 'yes' ``` ``` echo 'game' echo 'yes' ``` 你也可以用三个反引号包裹一段代码,并指定一种语言(也可以不指定): ``` ```py print('yes') ``` ``` ```py print('yes') ``` ## 链接 直接使用链接地址: `<https://www.baidu.com>` [https://www.baidu.com](https://www.baidu.com) 带名字替换的链接使用方法如下: `这是一个链接 [菜鸟教程](https://www.runoob.com)` 这是一个链接 [菜鸟教程](https://www.runoob.com) 高级链接允许我们给文章添加引文: ```markdown 这个链接用 1 作为网址变量 [Google][1] 这个链接用 runoob 作为网址变量 [Runoob][runoob] 然后在文档的结尾为变量赋值(网址) [1]: http://www.google.com/ [runoob]: http://www.runoob.com/ ``` 这个链接用 1 作为网址变量 [Google][1]http://www.google.com/ 这个链接用 runoob 作为网址变量 [Runoob]http://www.runoob.com/ 然后在文档的结尾为变量赋值(网址) ## 图片 `感叹号 ! + [图片的替代文字] + (图片的网址)` 例如 ` ![alt text](http://path/to/img.jpg "title")` 同文章的链接,比如说回到开始的[标题](#标题) ` [Title](#你的链接地址)` 这里是 `[标题](#标题)` [标题](#标题) 当图片不存在时显示替代文本,这里另外给图片嵌套了一层链接,可以点击图片到百度 ` [![alt text](http://path/to/img.jpg "title")](https://baidu.com)` [![alt text](http://path/to/img.jpg "title")](https://baidu.com) Markdown 还没有办法指定图片的高度与宽度,如果你需要的话,你可以使用普通的 `<img> `标签。 `<img src="http://static.runoob.com/images/runoob-logo.png" width="50%">` <img src="http://static.runoob.com/images/runoob-logo.png" width="50%"> ## 表格 Markdown 制作表格使用 `|` 来分隔不同的单元格,使用 `-` 来分隔表头和其他行。 表格的对齐方式 `- -:` 设置内容和标题栏居右对齐 `- :- `设置内容和标题栏居左对齐 `- :-:` 设置内容和标题栏居中对齐 ```markdown | 左对齐 | 右对齐 | 居中对齐 | | :----- | -----: | :------: | | 单元格 | 单元格 | 单元格 | | 单元格 | 单元格 | 单元格 | ``` | 左对齐 | 右对齐 | 居中对齐 | | :----- | -----: | :------: | | 单元格 | 单元格 | 单元格 | | 单元格 | 单元格 | 单元格 | ## 高级技巧 ### 支持 HTML 标签 不在 Markdown 涵盖范围之内的标签,都可以直接在文档里面用 HTML 撰写。 目前支持的 HTML 元素有:`<kbd> 键盘<b>粗体 <i>斜体 <em>强调 <sup> 上标<sub>下标 <br>换行`等 ,如: 使用 <kbd>Ctrl</kbd>+<kbd>Alt</kbd>+<kbd>Del</kbd> 重启电脑 <button type="button">Click Me!</button> ### 注释 这个一般不会用到的,可以直接跳过,到[转义](#转义) <div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-e18c614857b615bb47dc5fbcb35d8b3a64" aria-expanded="true"><div class="accordion-toggle"><span>注释</span> <i class="pull-right fontello icon-fw fontello-angle-right"></i> </div> </div> <div class="panel-body collapse-panel-body"> <div id="collapse-e18c614857b615bb47dc5fbcb35d8b3a64" class="collapse collapse-content"><p></p> ``` <div style='display: none'> 哈哈我是注释,不会在浏览器中显示。 我也是注释。 </div> <!--哈哈我是注释,不会在浏览器中显示。--> <!-- 哈哈我是多段 注释, 不会在浏览器中显示。 --> hack 方法比上面 2 种方法稳定得多,但是语义化太差。 [comment]: <> (哈哈我是注释,不会在浏览器中显示。) [comment]: <> (哈哈我是注释,不会在浏览器中显示。) [comment]: <> (哈哈我是注释,不会在浏览器中显示。) [//]: <> (哈哈我是注释,不会在浏览器中显示。) [//]: # (哈哈我是注释,不会在浏览器中显示。) 其中,这种方法最稳定,适用性最强: [//]: # "哈哈我是注释,不会在浏览器中显示。" 这种方法最可爱,超级无敌萌啊: [^_^]: # (哈哈我是注释,不会在浏览器中显示。) ``` <p></p></div></div></div> ### 转义 `**文本加粗** > \*\* 正常显示星号 \*\*` **文本加粗** > \*\* 正常显示星号 \*\* Markdown 支持以下这些符号前面加上反斜杠来帮助插入普通的符号: ``` \ 反斜线 ` 反引号 * 星号 _ 下划线 {} 花括号 [] 方括号 () 小括号 # 井字号 + 加号 - 减号 . 英文句点 ! 感叹号 ``` ### Latex 公式 行内公式排版:$c = \sqrt{a^{2}+b\_{xy}^{2}+e^{x}}$ 的源码是`$c = \sqrt{a^{2}+b\_{xy}^{2}+e^{x}}$` 块公式排版: `$$ c = \sqrt{a^{2}+b\_{xy}^{2} +e^{x}} $$` $$ c = \sqrt{a^{2}+b\_{xy}^{2} +e^{x}} $$ 需要转义的字符 `# $ % & ~ _ ^ \ { }`有特殊意义,需要表示这些字符时,需要转义,即在每个字符前加上 `\` 。 4) 方框 `\boxed` 命令给公式加一个方框。 `$\boxed{E=mc^2}$` $\boxed{E=mc^2}$ 希腊字母 ![希腊字母](https://seeyou.stdcdn.com/3187098-f9884c349c6d36df.webp) 具体 latex 公式规范可参考 [简书 latex in markdown 教程](https://www.jianshu.com/p/8c46e915c45e) ## Links [菜鸟 Markdown 教程](https://www.runoob.com/markdown/md-tutorial.html) [简书 latex in markdown 教程](https://www.jianshu.com/p/8c46e915c45e) [runoob]: http://www.runoob.com/ [1]: http://www.google.com/ [^runoob]: 这是脚注 最后修改:2022 年 01 月 17 日 03 : 49 PM © 允许规范转载 赞赏 如果觉得我的文章对你有用,请随意赞赏 赞赏作者 支付宝微信