本文記錄了CSDN原始提供的Markdown編輯器語法以及部分博主在應用過程中用到的語法規則。更新於2018.10.18。

這裡寫自定義目錄標題

• 歡迎使用Markdown編輯器
• 新的改變
• 功能快捷鍵
• 合理的建立標題，有助於目錄的生成
• 如何改變文字的樣式（含補充）
• 插入連結與圖片
• 如何插入一段漂亮的程式碼片
• 生成一個適合你的列表
• 建立一個表格（含補充內容）
• 設定內容居中、居左、居右
• SmartyPants
• 建立一個自定義列表
• 如何建立一個註腳
• 註釋也是必不可少的
• KaTeX數學公式
• 新的甘特圖功能，豐富你的文章
• UML 圖表
• FLowchart流程圖
• 匯出與匯入
• 匯出
• 匯入

歡迎使用Markdown編輯器

你好！ 這是你第一次使用 Markdown編輯器 所展示的歡迎頁。如果你想學習如何使用Markdown編輯器, 可以仔細閱讀這篇文章，瞭解一下Markdown的基本語法知識。

新的改變

我們對Markdown編輯器進行了一些功能拓展與語法支援，除了標準的Markdown編輯器功能，我們增加了如下幾點新功能，幫助你用它寫部落格：

1. 全新的介面設計 ，將會帶來全新的寫作體驗；
2. 在創作中心設定你喜愛的程式碼高亮樣式，Markdown 將程式碼片顯示選擇的高亮樣式 進行展示；
3. 增加了 圖片拖拽 功能，你可以將本地的圖片直接拖拽到編輯區域直接展示；
4. 全新的 KaTeX數學公式 語法；
5. 增加了支援甘特圖的mermaid語法¹ 功能；
6. 增加了 多螢幕編輯 Markdown文章功能；
7. 增加了 焦點寫作模式、預覽模式、簡潔寫作模式、左右區域同步滾輪設定 等功能，功能按鈕位於編輯區域與預覽區域中間；
8. 增加了 檢查列表 功能。

功能快捷鍵

撤銷：Ctrl/Command + Z

重做：Ctrl/Command + Y
加粗：Ctrl/Command + Shift + B
斜體：Ctrl/Command + Shift + I
標題：Ctrl/Command + Shift + H
刪除線：Ctrl/Command + Shift + S
無序列表：Ctrl/Command + Shift + U
有序列表：Ctrl/Command + Shift + O
檢查列表：Ctrl/Command + Shift + C
插入程式碼：Ctrl/Command + Shift + K
插入連結：Ctrl/Command + Shift + L
插入圖片：Ctrl/Command + Shift + G

合理的建立標題，有助於目錄的生成

直接輸入1次#，並按下space後，將生成1級標題。
輸入2次#，並按下space後，將生成2級標題。
以此類推，我們支援6級標題。有助於使用TOC語法後生成一個完美的目錄。

如何改變文字的樣式（含補充）

強調文字 強調文字

加粗文字 加粗文字

標記文字

刪除文字

引用文字

H₂O is是液體。

2¹⁰ 運算結果是 1024.

下面是補充內容

語法：

<font color=#0099ff size=7 face="黑體">color=#0099ff size=72 face="黑體"</font>
<font color=#00ffff size=72>color=#00ffff</font>
<font color=gray size=72>color=gray</font>

呈現效果：

color=#0099ff size=72 face=“黑體”
color=#00ffff
color=gray

顏色列表：

顏色名	十六進位制顏色值	顏色
Azure	#F0FFFF	rgb(240, 255, 255)
MintCream	#F5FFFA	rgb(245, 255, 250)
LightCyan	#E0FFFF	rgb(224, 255, 255)
AliceBlue	#F0F8FF	rgb(240, 248, 255)
Lavender	#E6E6FA	rgb(230, 230, 250)
LightBlue	#ADD8E6	rgb(173, 216, 230)
PowderBlue	#B0E0E6	rgb(176, 224, 230)
LightSteelBlue	#B0C4DE	rgb(176, 196, 222)
Aqua	#00FFFF	rgb(0, 255, 255)
Cyan	#00FFFF	rgb(0, 255, 255)
Aquamarine	#7FFFD4	rgb(127, 255, 212)
MediumAquaMarine	#66CDAA	rgb(102, 205, 170)
Turquoise	#40E0D0	rgb(64, 224, 208)
MediumTurquoise	#48D1CC	rgb(72, 209, 204)
DarkTurquoise	#00CED1	rgb(0, 206, 209)
CadetBlue	#5F9EA0	rgb(95, 158, 160)
LightSeaGreen	#20B2AA	rgb(32, 178, 170)
DarkCyan	#008B8B	rgb(0, 139, 139)
Teal	#008080	rgb(0, 128, 128)
PaleTurquoise	#AFEEEE	rgb(175, 238, 238)
LightSkyBlue	#87CEFA	rgb(135, 206, 250)
SkyBlue	#87CEEB	rgb(135, 206, 235)
DeepSkyBlue	#00BFFF	rgb(0, 191, 255)
CornflowerBlue	#6495ED	rgb(100, 149, 237)
SteelBlue	#4682B4	rgb(70, 130, 180)
DodgerBlue	#1E90FF	rgb(30, 144, 255)
RoyalBlue	#4169E1	rgb(65, 105, 225)
Blue	#0000FF	rgb(0, 0, 255)
MediumBlue	#0000CD	rgb(0, 0, 205)
DarkBlue	#00008B	rgb(0, 0, 139)
Navy	#000080	rgb(0, 0, 128)
MidnightBlue	#191970	rgb(25, 25, 112)
DarkSlateBlue	#483D8B	rgb(72, 61, 139)
SlateBlue	#6A5ACD	rgb(106, 90, 205)
LightSlateBlue	#8470FF	rgb(132, 112, 255)
MediumSlateBlue	#7B68EE	rgb(123, 104, 238)
Indigo	#4B0082	rgb(75, 0, 130)
DarkMagenta	#8B008B	rgb(139, 0, 139)
Purple	#800080	rgb(128, 0, 128)
MediumPurple	#9370D8	rgb(147, 112, 216)
BlueViolet	#8A2BE2	rgb(138, 43, 226)
DarkViolet	#9400D3	rgb(148, 0, 211)
DarkOrchid	#9932CC	rgb(153, 50, 204)
MediumOrchid	#BA55D3	rgb(186, 85, 211)
Orchid	#DA70D6	rgb(218, 112, 214)
Violet	#EE82EE	rgb(238, 130, 238)
Plum	#DDA0DD	rgb(221, 160, 221)
Thistle	#D8BFD8	rgb(216, 191, 216)
DeepPink	#FF1493	rgb(255, 20, 147)
VioletRed	#D02090	rgb(208, 32, 144)
MediumVioletRed	#C71585	rgb(199, 21, 133)
PaleVioletRed	#D87093	rgb(216, 112, 147)
Magenta	#FF00FF	rgb(255, 0, 255)
Fuchsia	#FF00FF	rgb(255, 0, 255)
HotPink	#FF69B4	rgb(255, 105, 180)
LightPink	#FFB6C1	rgb(255, 182, 193)
Pink	#FFC0CB	rgb(255, 192, 203)
MistyRose	#FFE4E1	rgb(255, 228, 225)
LavenderBlush	#FFF0F5	rgb(255, 240, 245)
GhostWhite	#F8F8FF	rgb(248, 248, 255)
Snow	#FFFAFA	rgb(255, 250, 250)
SeaShell	#FFF5EE	rgb(255, 245, 238)
OldLace	#FDF5E6	rgb(253, 245, 230)
FloralWhite	#FFFAF0	rgb(255, 250, 240)
Ivory	#FFFFF0	rgb(255, 255, 240)
HoneyDew	#F0FFF0	rgb(240, 255, 240)
Beige	#F5F5DC	rgb(245, 245, 220)
Cornsilk	#FFF8DC	rgb(255, 248, 220)
Linen	#FAF0E6	rgb(250, 240, 230)
BlanchedAlmond	#FFEBCD	rgb(255, 235, 205)
Bisque	#FFE4C4	rgb(255, 228, 196)
AntiqueWhite	#FAEBD7	rgb(250, 235, 215)
LightSalmon	#FFA07A	rgb(255, 160, 122)
DarkSalmon	#E9967A	rgb(233, 150, 122)
Feldspar	#D19275	rgb(209, 146, 117)
RosyBrown	#BC8F8F	rgb(188, 143, 143)
Orange	#FFA500	rgb(255, 165, 0)
Darkorange	#FF8C00	rgb(255, 140, 0)
Chocolate	#D2691E	rgb(210, 105, 30)
Coral	#FF7F50	rgb(255, 127, 80)
Tomato	#FF6347	rgb(255, 99, 71)
Salmon	#FA8072	rgb(250, 128, 114)
LightCoral	#F08080	rgb(240, 128, 128)
IndianRed	#CD5C5C	rgb(205, 92, 92)
FireBrick	#B22222	rgb(178, 34, 34)
Brown	#A52A2A	rgb(165, 42, 42)
Maroon	#800000	rgb(128, 0, 0)
DarkRed	#8B0000	rgb(139, 0, 0)
Crimson	#DC143C	rgb(220, 20, 60)
OrangeRed	#FF4500	rgb(255, 69, 0)
Red	#FF0000	rgb(255, 0, 0)
White	#FFFFFF	rgb(255, 255, 255)
WhiteSmoke	#F5F5F5	rgb(245, 245, 245)
Gainsboro	#DCDCDC	rgb(220, 220, 220)
LightGrey	#D3D3D3	rgb(211, 211, 211)
Silver	#C0C0C0	rgb(192, 192, 192)
DarkGray	#A9A9A9	rgb(169, 169, 169)
Gray	#808080	rgb(128, 128, 128)
DimGray	#696969	rgb(105, 105, 105)
Black	#000000	rgb(0, 0, 0)
GreenYellow	#ADFF2F	rgb(173, 255, 47)
Chartreuse	#7FFF00	rgb(127, 255, 0)
LawnGreen	#7CFC00	rgb(124, 252, 0)
SpringGreen	#00FF7F	rgb(0, 255, 127)
MediumSpringGreen	#00FA9A	rgb(0, 250, 154)
PaleGreen	#98FB98	rgb(152, 251, 152)
LightGreen	#90EE90	rgb(144, 238, 144)
DarkSeaGreen	#8FBC8F	rgb(143, 188, 143)
Lime	#00FF00	rgb(0, 255, 0)
LimeGreen	#32CD32	rgb(50, 205, 50)
MediumSeaGreen	#3CB371	rgb(60, 179, 113)
SeaGreen	#2E8B57	rgb(46, 139, 87)
ForestGreen	#228B22	rgb(34, 139, 34)
Green	#008000	rgb(0, 128, 0)
DarkGreen	#006400	rgb(0, 100, 0)
SlateGray	#708090	rgb(112, 128, 144)
LightSlateGray	#778899	rgb(119, 136, 153)
DarkSlateGray	#2F4F4F	rgb(47, 79, 79)
LightYellow	#FFFFE0	rgb(255, 255, 224)
LightGoldenRodYellow	#FAFAD2	rgb(250, 250, 210)
LemonChiffon	#FFFACD	rgb(255, 250, 205)
PaleGoldenRod	#EEE8AA	rgb(238, 232, 170)
Khaki	#F0E68C	rgb(240, 230, 140)
DarkKhaki	#BDB76B	rgb(189, 183, 107)
Olive	#808000	rgb(128, 128, 0)
YellowGreen	#9ACD32	rgb(154, 205, 50)
OliveDrab	#6B8E23	rgb(107, 142, 35)
DarkOliveGreen	#556B2F	rgb(85, 107, 47)
PapayaWhip	#FFEFD5	rgb(255, 239, 213)
PeachPuff	#FFDAB9	rgb(255, 218, 185)
Moccasin	#FFE4B5	rgb(255, 228, 181)
Wheat	#F5DEB3	rgb(245, 222, 179)
NavajoWhite	#FFDEAD	rgb(255, 222, 173)
BurlyWood	#DEB887	rgb(222, 184, 135)
Tan	#D2B48C	rgb(210, 180, 140)
Yellow	#FFFF00	rgb(255, 255, 0)
Gold	#FFD700	rgb(255, 215, 0)
DarkGoldenRod	#B8860B	rgb(184, 134, 11)
SandyBrown	#F4A460	rgb(244, 164, 96)
GoldenRod	#DAA520	rgb(218, 165, 32)
Peru	#CD853F	rgb(205, 133, 63)
Sienna	#A0522D	rgb(160, 82, 45)
SaddleBrown	#8B4513	rgb(139, 69, 19)

設定背景色

效果：

背景色的設定是按照十六進位制顏色值：#7FFFD4

背景色的設定是按照十六進位制顏色值：#FF83FA

背景色的設定是按照十六進位制顏色值：#D1EEEE

背景色的設定是按照十六進位制顏色值：#C0FF3E

背景色的設定是按照十六進位制顏色值：#54FF9F

程式碼：

<table><tr><td bgcolor=#FF00FF>背景色的設定是按照十六進位制顏色值：#7FFFD4</td></tr></table>
<table><tr><td bgcolor=#FF83FA>背景色的設定是按照十六進位制顏色值：#FF83FA</td></tr></table>
<table><tr><td bgcolor=#D1EEEE>背景色的設定是按照十六進位制顏色值：#D1EEEE</td></tr></table>
<table><tr><td bgcolor=#C0FF3E>背景色的設定是按照十六進位制顏色值：#C0FF3E</td></tr></table>
<table><tr><td bgcolor=#54FF9F>背景色的設定是按照十六進位制顏色值：#54FF9F</td></tr></table>

插入連結與圖片

連結: link.

圖片:

帶尺寸的圖片:

當然，我們為了讓使用者更加便捷，我們增加了圖片拖拽功能。

如何插入一段漂亮的程式碼片

去部落格設定頁面，選擇一款你喜歡的程式碼片高亮樣式，下面展示同樣高亮的 程式碼片.

// An highlighted block
var foo = 'bar';

生成一個適合你的列表

• 專案
  • 專案
    • 專案

1. 專案1
2. 專案2
3. 專案3

• 計劃任務
• 完成任務

建立一個表格（含補充內容）

一個簡單的表格是這麼建立的：

專案	Value
電腦	$1600
手機	$12
導管	$1

設定內容居中、居左、居右

使用:---------:居中
使用:----------居左
使用----------:居右

第一列	第二列	第三列
第一列文字居中	第二列文字居右	第三列文字居左

SmartyPants

SmartyPants將ASCII標點字元轉換為“智慧”印刷標點HTML實體。例如：

TYPE	ASCII	HTML
Single backticks	'Isn't this fun?'	‘Isn’t this fun?’
Quotes	"Isn't this fun?"	“Isn’t this fun?”
Dashes	-- is en-dash, --- is em-dash	– is en-dash, — is em-dash

補充內容

<th> 表頭
<tr> 一行
<td> 一列

建立一個自定義列表

Markdown

Text-to- HTML conversion tool

Authors

John

Luke

如何建立一個註腳

一個具有註腳的文字。²

註釋也是必不可少的

Markdown將文字轉換為 HTML。

KaTeX數學公式

您可以使用渲染LaTeX數學表示式 KaTeX:

Gamma公式展示 $\Gamma(n) = (n-1)!\quad\forall n\in\mathbb N$ 是通過尤拉積分

$\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.$

你可以找到更多關於的資訊 LaTeX 數學表示式here.

新的甘特圖功能，豐富你的文章

• 關於 甘特圖 語法，參考 這兒,

UML 圖表

可以使用UML圖表進行渲染。 Mermaid. 例如下面產生的一個序列圖：:

這將產生一個流程圖。:

• 關於 Mermaid 語法，參考 這兒,

FLowchart流程圖

我們依舊會支援flowchart的流程圖：

• 關於 Flowchart流程圖 語法，參考 這兒.

匯出與匯入

匯出

如果你想嘗試使用此編輯器, 你可以在此篇文章任意編輯。當你完成了一篇文章的寫作, 在上方工具欄找到 文章匯出 ，生成一個.md檔案或者.html檔案進行本地儲存。

匯入

如果你想載入一篇你寫過的.md檔案或者.html檔案，在上方工具欄可以選擇匯入功能進行對應副檔名的檔案匯入，
繼續你的創作。

---

1. mermaid語法說明 ↩︎

2. 註腳的解釋 ↩︎