簡明教程：https://ouweiya.gitbooks.io/markdown/
1.標題
代碼
注：# 后面保持空格
# h1
## h2
### h3
#### h4
##### h5
###### h6
####### h7 // 錯誤代碼
######## h8 // 錯誤代碼
######### h9 // 錯誤代碼
########## h10 // 錯誤代碼
演示
h1
h2
h3
h4
h5
h6
####### h7
######## h8
######### h9
########## h10
2.分級標題
代碼
注：= - 最少可以只寫一個，兼容性一般
一級標題
======================
二級標題
---------------------
演示
3.TOC
注：根據(jù)標題生成目錄凳兵，兼容性一般
代碼
[TOC]
演示
4.引用
代碼1(單行式)
> hello world!
演示
hello world!
代碼2(多行式)
> hello world!
hello world!
hello world!
或者
> hello world!
> hello world!
> hello world!
演示
相同的結果
hello world!
hello world!
hello world!
代碼3(多層嵌套)
> aaaaaaaaa
>> bbbbbbbbb
>>> cccccccccc
演示
aaaaaaaaa
bbbbbbbbb
cccccccccc
5.行內(nèi)標記
注：用 ` 標記代碼塊將變成一行
代碼
標記之外`hello world`標記之外
演示
標記之外hello world標記之外
錯誤代碼
注：不同平臺錯誤略有差異
標記之外 `
< div>
< div></div>
< div></div>
< div></div>
< /div>
`標記之外
演示
6.代碼塊
注：與上行距離一空行
代碼1(```)
注：用`````生成塊
<div>
<div></div>
<div></div>
<div></div>
</div>
演示
<div>
<div></div>
<div></div>
<div></div>
</div>
代碼2(Tab)
注： Tab縮進
我是文字……
<div>
<div></div>
<div></div>
<div></div>
</div>
演示
<div>
<div></div>
<div></div>
<div></div>
</div>
代碼3(自定義語法)
注：根據(jù)不同的語言配置不同的代碼著色
```javascript
var num = 0;
for (var i = 0; i < 5; i++) {
num+=i;
}
console.log(num);
**演示**
var num = 0;
for (var i = 0; i < 5; i++) {
num+=i;
}
console.log(num);
* * *
### 7.插入鏈接
**代碼1(內(nèi)鏈式)**
注：`{:target="_blank"}`跳轉方式兼容性一般 纠吴，多數(shù)第三方平臺不支持跳轉
[百度1](http://www.baidu.com/" 百度一下"){:target="_blank"}
**演示**
[百度1](http://www.baidu.com/%22%E7%99%BE%E5%BA%A6%E4%B8%80%E4%B8%8B%22)
**代碼2(引用式)**
[百度2][2]{:target="_blank"}
[2]: http://www.baidu.com/ "百度二下"
**演示**
[百度2](http://www.baidu.com/%22%E7%99%BE%E5%BA%A6%E4%B8%80%E4%B8%8B%22)
* * *
### 8.插入圖片
**代碼1(內(nèi)鏈式)**
[圖片上傳失敗...(image-90880b-1542510791300)]
**演示**
**代碼2(引用式)**
![name][01]
[01]: ./01.png '描述'
**演示**
* * *
### 9.插入圖片帶有鏈接
**代碼**
[圖片上傳失敗...(image-f83b77-1542510791300)]{:target="_blank"} // 內(nèi)鏈式
[[圖片上傳失敗...(image-4dc956-1542510791300)]][5]{:target="_blank"} // 引用式
[5]: http://www.baidu.com
**演示**
[](http://www.baidu.com)
[](http://www.baidu.com)
[
][5]
[5]: [http://www.baidu.com](http://www.baidu.com)
* * *
### 10.視頻插入
注：Markdown 語法是不支持直接插入視頻的
普遍的做法是 插入HTML的 iframe 框架，通過網(wǎng)站自帶的分享功能獲取奕坟，如果沒有可以嘗試第二種方法
第二是偽造播放界面扒怖，實質(zhì)是插入視頻圖片疗认，然后通過點擊跳轉到相關頁面
**代碼1**
注：多數(shù)第三方平臺不支持插入`<iframe>`視頻
<iframe height=498 width=510 src='http://player.youku.com/embed/XMjgzNzM0NTYxNg==' frameborder=0 'allowfullscreen'></iframe>
**演示**
**代碼2**
[圖片上傳失敗...(image-49aefe-1542510791300)]{:target="_blank"}
**演示**
[](http://v.youku.com/v_show/id_XMjgzNzM0NTYxNg==.html?spm=a2htv.20009910.contentHolderUnit2.A&from=y1.3-tv-grid-1007-9910.86804.1-2#paction)
[](http://v.youku.com/v_show/id_XMjgzNzM0NTYxNg==.html?spm=a2htv.20009910.contentHolderUnit2.A&from=y1.3-tv-grid-1007-9910.86804.1-2#paction)
* * *
### 11.序表
**代碼1(有序)**
注：序列`.`后 保持空格
1. one
2. two
3. three
**演示**
1. one
2. two
3. three
**代碼2(無序)**
- one
- two
- three
**演示**
* one
* two
* three
**代碼3(序表嵌套)**
1. one
1. one-1
2. two-2
2. two
* two-1
* two-2
**演示**
1. one
1. one-1
2. two-2
2. two
* two-1
* two-2
* * *
**代碼4(序表嵌套代碼塊)**
注：換行+兩個Tab
-
one
var a = 10; // 與上行保持空行并 遞進縮進
**演示：**
* one
```
var a = 10;
```
* * *
### 12.任務列表
注：兼容性一般 要隔開一行
**代碼**
這是文字……
- [x] 選項一
- [ ] 選項二
- [ ] [選項3]
**演示**
* * *
### 13.表情
注：兼容一般
[表情代碼地址](https://www.webpagefx.com/tools/emoji-cheat-sheet/'GitHub')
* * *
### 14.表格
注： `:` 代表對齊方式 ,** `:` 與 `|` 之間不要有空格**急侥，否則對齊會有些不兼容
**代碼1**
| a | b | c |
|---|---|---|
| 居中 | 左對齊 | 右對齊 |
| ========= | =============== | ============ |
**演示**
| a | b | c |
| --- | --- | --- |
| 居中 | 左對齊 | 右對齊 |
| ========= | =============== | ============ |
* * *
**代碼2(簡約寫法)**
| a | b | c |
|---|---|---|
| 居中 | 左對齊 | 右對齊 |
| ============ | ================= | ============= |
**演示**
| a | b | c |
| --- | --- | --- |
| 居中 | 左對齊 | 右對齊 |
| ============ | ================= | ============= |
**代碼3(特殊表格)**
注：一般對合并單元格，以及其他特殊格式表格侮邀，markdown 是無能為力的
所以常規(guī)的做法是使用HTML標簽坏怪，但是這樣的編寫效率極低。
但是有了這款工具的話绊茧，所有問題都迎刃而解铝宵。
在線生成HTML代碼 [Tables Generator](http://www.tablesgenerator.com/) (國外的站)
**演示**
* * *
### 15.支持內(nèi)嵌CSS樣式
**代碼**
<p style="color: #AD5D0F;font-size: 30px; font-family: '宋體';">內(nèi)聯(lián)樣式</p>
**演示**
* * *
### 16.語義標記
| 描述 | 效果 | 代碼 |
| --- | --- | --- |
| 斜體 | *斜體* | `*斜體*` |
| 斜體 | *斜體* | `_斜體_` |
| 加粗 | **加粗** | `**加粗**` |
| 加粗+斜體 | ***加粗+斜體*** | `***加粗+斜體***` |
| 加粗+斜體 | ***加粗+斜體*** | `**_加粗+斜體_**` |
| 刪除線 | ~~刪除線~~ | `~~刪除線~~` |
* * *
### 17.語義標簽
| 描述 | 效果 | 代碼 |
| --- | --- | --- |
| 斜體 | <i>斜體</i> | `<i>斜體</i>` |
| 加粗 | <b>加粗</b> | `<b>加粗</b>` |
| 強調(diào) | <em>強調(diào)</em> | `<em>強調(diào)</em>` |
| 上標 | Z<sup>a</sup> | `Z<sup>a</sup>` |
| 下標 | Z<sub>a</sub> | `Z<sub>a</sub>` |
| 鍵盤文本 |
| `<kbd>Ctrl</kbd>` |
| 換行 | | |
* * *
### 18.格式化文本
**保持輸入排版格式不變**
注：對內(nèi)含標簽需要破壞結構才能顯示
**代碼**
<pre>
hello world
hi
hello world
</pre>
**演示**
<pre>
hello world
hi
hello world
</pre>
**錯誤解決方法**
注：標簽內(nèi)部添加空格 或者 **直接使用`````標記來處理**
**代碼1(插入空格)**
<pre>
< div>
< div>< /div>
< div>< /div>
< div>< /div>
< /div>
</pre>
**演示**
<pre>
< div>
< div>< /div>
< div>< /div>
< div>< /div>
< /div>
</pre>
**代碼2( ````` 代碼塊標記)**
<div>
<div></div>
<div></div>
<div></div>
</div>
**演示**
