• • 基本語法
    • • 生成目錄
      • 列表
        • 有序列表
        • 無序列表
      • 表格
      • 圖片
      • URL連結
      • 數學符號
  • 幾個有用的特性
    • • 程式碼塊樣式（code block）
      • 數學表示式塊（math block）
      • 繪製圖表
      • 其他特性
  • 檔案轉換
    • • markdown和word的轉換

安利一下很好用的markdown編輯器Typora。它功能很強大，具有簡潔，跨平臺，所見即所得的特點，支援Markdown語法，可以插入數學公式、表情、圖示等。下面簡單介紹下基本的語法以供編輯時檢視，以及幾個有用的特性，利用工具特有的便捷設定可以讓我們真正實現用工具的效果和達到便捷的目的。

我們可以從官網上下載Typora，她支援mac、windows、linux三個平臺。

基本語法

生成目錄

輸入[toc]，然後輸入回車，就可以自動生成目錄列表（table of content）了。

列表

有序列表

在列表前加上數學序號（數字序號和列表內容之間要有一個空格），即可生成有序列表，比如下面程式碼的生成樣式見程式碼塊下的形式

1. 蘋果
2. 西瓜

1. 蘋果
2. 西瓜

無序列表

可以在列表內容前加上+、*、-等（符號和列表內容之間要有一個空格），即可生成無序列表，如：

+ 蘋果
+ 西瓜

• 蘋果
• 西瓜

表格

可以使用Ctrl+T快捷鍵來插入表格，按下快捷鍵之後就會出現一個表格設定，預先設定行數和列數，然後就出現表格了。使用者可以直接像在office上編輯表格內容那樣對錶格進行編輯，並通過每列上的按鈕來設定該列的內容的對齊方式（提供向左、居中、向右對齊）。

如果你想增加或刪減行數和列數，可以直接通過表格左上角的按鈕改變表格的行數和列數。

圖片

對於本地圖片，我們可以直接拖進來，Typora會自動識別圖片並幫我們生成圖片的地址。

URL連結

• 使用尖括號<>可以插入url連結的內容，實現自動連結，如：www.baidu.com，其效果為www.baidu.com。
• 如果不想把連結地址顯示出來，只是對連結地址進行說明的話，可以通過[連結說明](連結地址)來實現，例如:[百度一下](www.baidu.com) ，其效果為百度一下。

數學符號

一些數學符號可以參見Latex數學符號表。

幾個有用的特性

程式碼塊樣式（code block）

Typora中的程式碼塊可以設定不同的語言，從而程式碼塊的內容根據不同的語言顯示對應的格式。

Typora中還可以提供了不同的樣式（theme）供使用者選擇，內建的樣式有五種，當然CodeMirror還提供了一些其他的樣式，使用者可根據自己的愛好選擇不同樣式。修改樣式的具體方法為：（以Sublime Text的Monokai樣式為例）

1. 把樣式表的內容複製貼上到主題目錄themes下的base.css或[theme].css樣式表文件內，其中[theme]表示對應的主題的名字，我使用的主題是Monokai，所以我修改的是Monokai.css檔案。貼上進去之後把.cm-s-monokai統一改成.cm-s-inner。
2. 在新增樣式的底部，新增程式碼塊的基礎樣式到樣式表中，如font-family、color和background等屬性，完成後的樣式表內容應該是類似這樣的:

/* Based on Sublime Text's Monokai theme */

.cm-s-inner.CodeMirror { background: #272822; color: #f8f8f2; }
.cm-s-inner div.CodeMirror-selected { background: #49483E; }
.cm-s-inner .CodeMirror-line::selection, .cm-s-inner .CodeMirror-line > span::selection, .cm-s-inner .CodeMirror-line > span > span::selection { background: rgba(73, 72, 62, .99); }
.cm-s-inner .CodeMirror-line::-moz-selection, .cm-s-inner .CodeMirror-line > span::-moz-selection, .cm-s-inner .CodeMirror-line > span > span::-moz-selection { background: rgba(73, 72, 62, .99); }
.cm-s-inner .CodeMirror-gutters { background: #272822; border-right: 0px; }
.cm-s-inner .CodeMirror-guttermarker { color: white; }
.cm-s-inner .CodeMirror-guttermarker-subtle { color: #d0d0d0; }
.cm-s-inner .CodeMirror-linenumber { color: #d0d0d0; }
.cm-s-inner .CodeMirror-cursor { border-left: 1px solid #f8f8f0; }

.cm-s-inner span.cm-comment { color: #75715e; }
.cm-s-inner span.cm-atom { color: #ae81ff; }
.cm-s-inner span.cm-number { color: #ae81ff; }

.cm-s-inner span.cm-property, .cm-s-inner span.cm-attribute { color: #a6e22e; }
.cm-s-inner span.cm-keyword { color: #f92672; }
.cm-s-inner span.cm-builtin { color: #66d9ef; }
.cm-s-inner span.cm-string { color: #e6db74; }

.cm-s-inner span.cm-variable { color: #f8f8f2; }
.cm-s-inner span.cm-variable-2 { color: #9effff; }
.cm-s-inner span.cm-variable-3, .cm-s-inner span.cm-type { color: #66d9ef; }
.cm-s-inner span.cm-def { color: #fd971f; }
.cm-s-inner span.cm-bracket { color: #f8f8f2; }
.cm-s-inner span.cm-tag { color: #f92672; }
.cm-s-inner span.cm-header { color: #ae81ff; }
.cm-s-inner span.cm-link { color: #ae81ff; }
.cm-s-inner span.cm-error { background: #f92672; color: #f8f8f0; }

.cm-s-inner .CodeMirror-activeline-background { background: #373831; }
.cm-s-inner .CodeMirror-matchingbracket {
  text-decoration: underline;
  color: white !important;
}

/**apply to code fences with plan text**/
.md-fences {
  background-color: #272822;
  color: #f8f8f2;
  border: none;
}
.md-fences .code-tooltip {
  background-color: #272822;
}

數學表示式塊（math block）

markdown中的數學表示式的語法跟latex的語法一樣，習慣latex語法的人可以採用latex的語法編輯數學表示式，但是其中也有一些不同，比如：

• 數學表示式的斜體字強制為非斜體字：{\rm [非斜體字的內容]}

  假設要將表示式中的and改為非斜體字的格式，可以採用 {\rm and}實現。

  1. 行內公式可以用$$後輸入回車來插入數學公式。（需要在File->Preferences中勾選“Inline math”）
  2. 行間公式可以採用math block來編輯，Typora中使用快捷鍵Ctrl+Shif+M即可顯示math block。

繪製圖表

Typora支援在編輯器中直接繪製一些簡單的圖表，比如流程圖等，這樣就使我們無須直接從其他地方複製一張圖片過來，但是要修改圖中的內容時，需要去其他地方修改，再複製貼上圖。

舉一個官方提供的例子：

比如程式碼為：

​```mermaid
graph LR
A[Hard edge] -->B(Round edge)
    B --> C{Decision}
    C -->|One| D[Result one]
    C -->|Two| E[Result two]
​```

其對應的效果圖為：

關於更詳細的圖表繪製方法簡介，可以參考官網提供的內容：Draw Diagrams With Markdown

其他特性

除了以上提到的，可以通過File->Preferences來設定一些特性。例如：

• 程式碼塊顯示行號：在Code Fences這一項中勾選“Display line number”即可。
• 關鍵詞高亮：在Syntex Support勾選“Highlight”這一項即可。然後就可以通過在==中插入需要關鍵詞來實現，如: ==關鍵詞==
• 輸入emoji表情：只需要輸入：和第一個字母即可出現候選的emoji表情。如:smile。

檔案轉換

markdown和word的轉換

使用工具：typora+pandoc

1、下載並安裝pandoc

​ pandoc的下載地址：https://github.com/jgm/pandoc/releases/tag/2.0.5

​ （注意，Windows選擇pandoc-**-windows.msi這個版本即可）

2、重啟typora

3、開啟要轉換格式的檔案，選擇“File”–>Export–> Word(.docx) 即可。

而如果要從word轉換為markdown，則用下面方法即可：

​ ctrl+c複製word文字，開啟typora，ctrl+v貼上。

參考資料

精美而強大的Markdown編輯器 - Typora http://www.jianshu.com/p/d328692b0486

基本語法：http://blog.csdn.net/qcx321/article/details/53780672

• 簡明版 Markdown 語法說明(簡體中文版)**
• 完整版 Markdown 語法說明(簡體中文版)**

數學符號：https://www.mohu.org/info/symbols/symbols.htm