Markdown - 语法

一、文本 分级标题的写法 1、2级标题 我是一级标题 === 我是二级标题 --- 预览： 我是一级标题 我是二级标题 Tab键形成一个块，可用于缩进，但是尽量少用，因为这样子在手机上显示不好 1~ 6级标题 # 我是一级标题 h1 ## 我是二级标题 h2 ### 我是三级标题 h3 #### 我是四级标题 h4 ##### 我是五级标题 h5 ###### 我是六级标题 h6 预览： 我是一级标题 h1 我是二级标题 h2 我是三级标题 h3 我是四级标题 h4 我是五级标题 h5 我是六级标题 h6 字体，共三种(粗、斜、删除，其它字体甭(beng)找了，没有！) *我是斜体* _我也是斜体_ **我是粗体** __我还是粗体__ ***我既粗又斜*** ~~我是删除体~~ <font color="green">我有颜色绿</font> <mark>我有背景，嘿嘿</mark> <small>我是小字体</small> O₂、H₂O、2¹⁰ 预览： 我是斜体 我也是斜体 我是粗体 我还是粗体 我既粗又斜 我是删除体 我有颜色绿 我有背景，嘿嘿 我是小字体 O2、H2O、210 可以看出来，它们自己不会换行的 超链接 Hyperlink 超链接的英文名是hyperlink，但是标记名是a，a的全拼为anchor，中文意思是锚。Suripse the fuck，哪个bitch读成的超链接 行内式 在[我的网站](http://ningtaostudy.cn) 把[鼠标](ningtaostudy.cn "我的网站")放上来 预览： 在 我的网站 把 鼠标 放上来 如果不加协议名的话它会在相对路径跳转 参考式 写在最后，直接调用，跟css类有点像 [百度][1]搜索很好用，也有[谷歌][2]搜索，但是谷歌去的少，得翻墙。 你可以在[百度][2]上搜到[我的博客][3] // 以下代码放在最后 [1]:https://baidu.com "百度搜索" [2]:https://google.com "谷歌搜索" [3]:http://ningtaostudy.cn "滔涛个人博客" 预览： 百度搜索很好用，也有谷歌搜索，但是谷歌去的少，得翻墙。 你可以在百度上搜到我的博客。 自动链接 网址或电子邮箱 // 用尖括号括起来即可 网址：<http://ningtaostudy.cn> 邮箱：<[email protected]> 预览： 网址：http://ningtaostudy.cn 邮箱：[email protected] 二、代码 写这图啥，还不是为了代码；越来越多的社区采用Markdown发文章，所以俺们也要好好学学，很明显，插入代码是必不可少的 行内式，一小行代码 我是`hello world`代码 预览： 我是hello world代码 缩进式，一大块代码 function say(name){ alert('hello, '+ name); }预览： function say(name){ alert('hello, '+ name); } 关于空格看不到的问题不用纠结，反正我们知道四个空格键或一个Tab可以这样表示就行了 一大块代码,用6个“ ` ”包裹 ``` function say(name){ alert('hello, '+ name); } ``` 预览： function say(name){ alert('hello, '+ name); } 原始代码，直接变成HTML了 <input type="radio" /> <div style="background: #009688;color: #fff;text-align: center;width: 50%;margin: 5px 0;padding: 5px;border-radius: 100px;box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12)">点我啊~</div> 点我啊~ 很明显我们看到有些支持、有些不支持。我列举几个支持的：br、mark、&nbsp;(反斜杠转义&)、table、div、u、del、big、small、sup、sub等等 奇怪的用法：<center>文字</center>。原来是html5中不再使用的标记，，， 我会独占一行并且居中 三、图片 行内式 我的桌面  预览： 我的桌面 它一般会独占一块区域，感觉都不像是行内了，但它的写法是在行内的。它的格式一般是这样的： 参考式 很像链接的方式，但链接是以数字索引的，图片以文字 ![我的爱妃][Aifei] // 下面代码写在最后 [Aifei]:https://tao-1252397519.cos.ap-shanghai.myqcloud.com/img-note/%E7%88%B1%E5%A6%83.jpg '爱妃' 四、分割线 这么多的内容，如果没有分割线的话还不得看到累 - - - --- * * * *** ---我是分割线---预览： ---我是分割线--- 很明显，我们不能在同一行键入其它字符(suprise the fuck) 五、表格 Markdown语法 -|姓名|年龄 -|-|- 简写|帅气涛|21 -|帅帅气涛|20 |-|姓名|年龄| |-|-|-| |原生的|帅气涛|21| |-|帅帅气涛|20| -|姓名|年龄 -|-:|-: 加个冒号指定方向|帅气涛|21 -|帅帅气涛|20 预览： - 姓名 年龄 简写 帅气涛 21 - 帅帅气涛 20 - 姓名 年龄 原生的 帅气涛 21 - 帅帅气涛 20 - 姓名 年龄 加个冒号指定方向 帅气涛 21 - 帅帅气涛 20 不同表格需要另起一行，第二行始终为分割线-|-|- 这种第一行表头会加粗 原生html <center> <table style="text-align: center"> <caption>我是表标题</caption> <thead> <tr> <th>X</th> <th>X</th> <th>O</th> </tr> </thead> <tbody> <tr> <td colspan=2>XX</td> <td>X</td> </tr> <tr> <td>X</td> <td>X</td> <td rowspan=2>OO</td> </tr> <tr> <td>X</td> <td>O</td> </tr> </tbody> <tfoot> <tr> <td colspan=3>OOO</td> </tr> </tfoot> </table> </center> 预览： 我是表标题 X X O XX X X X OO X O OOO 虽然说并不推荐再使用h4的标记，但是在Markdown中有用就行，反正浏览器也兼容，用着呗 六、列表 有序列表 它的定义很简单，数字+点号即可。额，在列表里的有序列表会换用罗马字符 1. 嗨~你好 2. 我的表呢 3. 又到了下午茶时间 预览： 嗨~你好 我的表呢 又到了下午茶时间 无序列表 它有有三个符号* + -，我感觉支持度最高的是 +，反正你用其它没事那就用着 * 叹服 * 通关 + 素颜 + 千古 - 给我你的爱 - 恁爸召唤兽 预览： 叹服 通关 素颜 千古 给我你的爱 恁爸召唤兽 定义型列表 名词+解释，感觉像是在...有点像教科解义的里名词解释，以前总是感觉自己背不住，现在还是。 帅气涛 : 史上最帅的涛，没有人可以在他面前讲帅这个字，他唯一的缺点就是太帅了 MarkDown : 轻量级文本标记语言，可以转换成html，pdf等格式 预览： 帅气涛 : 史上最帅的涛，没有人可以在他面前讲帅这个字，他唯一的缺点就是太帅了 MarkDown : 轻量级文本标记语言，可以转换成html，pdf等格式 一个有趣的情况 2017. 世界博览群书大会记 预览： 世界博览群书大会记 可以看到，它会显示一个非常大的罗马数字，主要是因为 数字+点号+空格 是产生列表的格式，而我们本意是指2017年，却不小心产生了列表。想要回原来的意思，可以使用\转义 2017\. 世界博览群书大会记预览： 2017. 世界博览群书大会记 顺便提一句，在列表里可以用Tab键来缩进的 七、引用 简单地使用 > 我是一条引用，你可以很明显地看到吗，对应blockquote // 在引用里写写Markdown > + hi > + hello > `我的天` 预览： 我是一条引用，你可以很明显地看到吗，对应blockquote hi hello 我的天 嵌套地引用 >>> 我给你发了条消息 - client >> 我看到你消息了，你确认下吧 - server > 好的，我们嗨皮吧 - client 预览： 我给你发了条消息 - client 我看到你消息了，你确认下吧 - server 好的，我们嗨皮吧 - client 八、注脚和锚点 注脚 我在有道云笔记[^note]上写Markdown[^1]语法，感觉比之前想写的Html[^2]笔记简单多了 // 下面的脚注会自动到文档末尾，它们之间得有空行 [^note]:有道云笔记是网易旗下一款方便记笔记的产品 [^1]:Markdown是一种编辑语法 [^2]:html是超文本标记语言，用于展示互联网上的数据 预览： 我在有道云笔记[^note]上写Markdown[^1]语法，感觉比之前想写的Html[^2]笔记简单多了 [^note]:有道云笔记是网易旗下一款方便记笔记的产品 [^1]:Markdown是一种编辑语法 [^2]:html是超文本标记语言，用于展示互联网上的数据 它们的点击可以互相跳转 锚点 **一、文本**{#index} // n行之后再写个 回到[文本](#index)介绍 预览： 回到文本介绍 跟超链接的写法一样，就是自己定义定位的地方而已。发现有道云笔记不支持... 九、LaTeX数学公式 这个原生Markdown是不支持的，可以到 latex.codecogs 上自动生成，然后再把图片地址复制出来就行了。而浏览器支持的则是MathJax MathJax的行内由\(与\)包裹，而不是单个$ MathJax块级则是$$包裹 行内式 使用 '$' 符号即可 质量守恒方程：$E=mc^2$ 预览： 质量守恒方程：$E=mc^2$ 整行公式 使用两个 '$$' 将它包起来 $$\sum_{i=1}^n a_i=0$$ $$f(x_1,x_x,\ldots,x_n) = x_1^2 + x_2^2 + \cdots + x_n^2 $$ $$\sum^{j-1}_{k=0}{\widehat{\gamma}_{kj} z_k}$$ 预览： $$\sum_{i=1}^n a_i=0$$ $$f(x_1,x_x,\ldots,x_n) = x_1^2 + x_2^2 + \cdots + x_n^2 $$ $$\sum^{j-1}_{k=0}{\widehat{\gamma}_{kj} z_k}$$ LaTeX一览表 符号 解释 代码 预览 $ 表示行内式 E=mc^2 $E=mc^2$ $$ 表示独占一行 E=mc^2 $$E=mc^2$$ \ 转义 $$$ $\$$ \\ 换行 $a=x+y\\b=y$ $a=x+y\\b=y$ _ 下标 $a_i$ $a_i$ ^ 上标 $a^i$ $a^i$ {} 括起来的一组内容 $x^{y^z}$ $x^{y^z}$ \frac 分数 $\frac{1}{a}$ $\frac{1}{a}$ \sqrt 平方根 $\sqrt{xy}+\sqrt[a]{x}$ $\sqrt{xy}+\sqrt[a]{x}$ \ldots 底对齐省略号 $a_{i\ldots{n}}$ $a_{i\ldots{n}}$ \cdots 中对齐省略号 $i\cdots n$ $i\cdots n$ \left \right 自适应分隔符 这个有点疑问 \sum 求和 $\sum_{k=1}^nkx $ $\sum_{k=1}^nkx$ \int 积分 $\int_a^b$ $\int_a^b$ \limits 强制上下限在上下侧 $\sum\limits_{k=1}^nkx $ $\sum\limits_{k=1}^nkx $ \nolimits 强制在左右侧 $\sum\nolimits_{k=1}^nkx$ $\sum\nolimits_{k=1}^nkx$ \overline 上划线 $\overline{a+b}$ $\overline{a+b}$ \underline 下划线 $\underline{a+b}$ $\underline{a+b}$ \overbrace 上花括号 $\overbrace{a+b+\dots+n}^{m个}$ $\overbrace{a+b+\dots+n}^{m个}$ \underbrace 下花括号 $\underbrace{a+b+\dots+n}_{m个}$ $\underbrace{a+b+\dots+n}_{m个}$ \vec 向量 $\vec{a}$ $\\vec{a}$ 十、流程图 ``` graph TD A[Start] --> B[Your Operation] B --> C{Yes or No?} C --> |yes| D[end] C --> |no| B ``` graph TD A[Start] --> B[Your Operation] B --> C{Yes or No?} C --> |yes| D[end] C --> |no| B 这里发现这种骚操作都得放在代码块里。并且Markdown不同解释器对流程图引用也不一样，笔记用的是 mermaid 插件，而CSDN博客则是使用 flowchart.js 附：CommonMark规范