MarkDown-Typora-Mac

[TOC]

1. 概述

1.1. 宗旨

Markdown的目標(biāo)是實(shí)現(xiàn)「易讀易寫」。

Markdown語法受到一些既有text-to-HTML格式的影響，包括Setext、atx、Textile、reStructuredText、Grutatext和EtText，而最大靈感來源其實(shí)是純文本電子郵件的格式。

1.2. 兼容 HTML

不在Markdown涵蓋范圍之內(nèi)的標(biāo)簽，都可以直接在文檔里面用HTML撰寫。不需要額外標(biāo)注這是HTML或是Markdown；只要直接加標(biāo)簽就可以了。

這是一個(gè)普通段落。
<table>
    <tr>
        <td>Foo</td>
    </tr>
</table>
這是另一個(gè)普通段落。

請(qǐng)注意，在HTML區(qū)塊標(biāo)簽間的Markdown格式語法將不會(huì)被處理。比如，你在HTML區(qū)塊內(nèi)使用Markdown樣式的強(qiáng)調(diào)會(huì)沒有效果。

1.3. 特殊字符自動(dòng)轉(zhuǎn)換

在HTML文件中，有兩個(gè)字符需要特殊處理：<和&。<符號(hào)用于起始標(biāo)簽，&符號(hào)則用于標(biāo)記HTML實(shí)體，如果你只是想要顯示這些字符的原型，你必須要使用實(shí)體的形式，像是<和&。

&字符尤其讓網(wǎng)絡(luò)文檔編寫者受折磨，如果你要打「AT&T」 ，你必須要寫成「AT&T」。而網(wǎng)址中的&字符也要轉(zhuǎn)換。比如你要鏈接到：

http://images.google.com/images?num=30&q=larry+bird

你必須要把網(wǎng)址轉(zhuǎn)換寫為

http://images.google.com/images?num=30&q=larry+bird

才能放到鏈接標(biāo)簽的href屬性里。不用說也知道這很容易忽略，這也可能是HTML標(biāo)準(zhǔn)檢驗(yàn)所檢查到的錯(cuò)誤中，數(shù)量最多的。

類似的狀況也會(huì)發(fā)生在<符號(hào)上，因?yàn)?strong>Markdown允許兼容 HTML，如果你是把<符號(hào)作為HTML標(biāo)簽的定界符使用，那Markdown也不會(huì)對(duì)它做任何轉(zhuǎn)換，但是如果你寫：

4 < 5

Markdown 將會(huì)把它轉(zhuǎn)換為：

4 < 5

不過需要注意的是，code范圍內(nèi)，不論是行內(nèi)還是區(qū)塊，<和&兩個(gè)符號(hào)都一定會(huì)被轉(zhuǎn)換成HTML實(shí)體，這項(xiàng)特性讓你可以很容易地用Markdown寫HTML code（和HTML相對(duì)而言，HTML語法中，你要把所有的<和&都轉(zhuǎn)換為HTML實(shí)體，才能在HTML文件里面寫出HTML code。）

2. Key

• Select word: cmd+D
• Delete word: shift+cmd+D
• Select line/sentence: cmd+L
• Delete line/sentence: shift+cmd+L
• Select row in table: cmd+L
• Add row in table: cmd+Enter
• Select Styled Scope (or cell in a table) cmd+E
• Jump to selection: cmd+J
• Jump to Top: cmd+
• Jump To Bottom: cmd+↓
• Increase/decrease heading level from <p> to <h1>: cmd+-/+
• New line: shift+Return
• Move table row/column: ? + ? + arrow key.

3. 區(qū)塊元素

3.1. 內(nèi)容目錄

在段落中填寫 [TOC] 以顯示全文內(nèi)容的目錄結(jié)構(gòu)。

3.2. 段落和換行

Return

Shift + Return

3.3. 標(biāo)題

Header 1
========

Header 2
--------

or

# Header 1
## Header 2
###### Header 6

3.4. 區(qū)塊引用

Angle brackets > are used for block quotes.
Technically not every line needs to start with a > as long as
there are no empty lines between paragraphs.
Looks kinda ugly though.

Block quotes can be nested.

Multiple Levels

Most markdown syntaxes work inside block quotes.

• Lists
• Links
• Etc.

Here is the code:

> Angle brackets `>` are used for block quotes.  
Technically not every line needs to start with a `>` as long as
there are no empty lines between paragraphs.  
> Looks kinda ugly though.
> > Block quotes can be nested.  
> > > Multiple Levels
>
> Most markdown syntaxes work inside block quotes.
>
> * Lists
> * [Links][arbitrary_id]
> * Etc.

3.5. 列表

• Lists must be preceded by a blank line (or block element)

• Unordered lists start each item with a *

• - works too

• Indent a level to make a nested list
  1. Ordered lists are supported.
  2. Start each item (number-period-space) like 1.
  3. It doesn't matter what number you use, I will render them sequentially
  4. So you might want to start each line with 1. and let me sort it out

Here is the code:

* Lists must be preceded by a blank line (or block element)
* Unordered lists start each item with a `*`
- `-` works too
    * Indent a level to make a nested list
        1. Ordered lists are supported.
        2. Start each item (number-period-space) like `1. `
        42. It doesn't matter what number you use, I will render them sequentially
        1. So you might want to start each line with `1.` and let me sort it out

1. [x] I can render checkbox list syntax

• [x] I support nesting
• [x] I support ordered and unordered lists

2. [ ] I don't support clicking checkboxes directly in the html window

3.6. 代碼區(qū)塊

Inline code is indicated by surrounding it with backticks:
`Inline code`
``Code with `backticks` `` (mind the spaces preceding the final set of backticks)
多段代碼換行+三個(gè)`

print('a')

多段代碼換行+三個(gè)~

var s = "JavaScript syntax highlighting";
alert(s);

s = "Python syntax highlighting"
print s

換行+tab

print('This is a code block')

3.7. 分隔線

*** or ---

4. 區(qū)段元素

4.1. 鏈接

uranusjr@gmail.com
<uranusjr@gmail.com>
http://macdown.uranusjr.com
<http://macdown.uranusjr.com>
Macdown Website
[Macdown Website](http://macdown.uranusjr.com "Title") (The title is optional)

4.2. 引用

Make a link [a link][arbitrary_id] then on it's own line anywhere else in the file:
[arbitrary_id]: http://macdown.uranusjr.com "Title"

If the link text itself would make a good id, you can link like this [like this][], then on it's own line anywhere else in the file:
[like this]: http://macdown.uranusjr.com

4.3. 強(qiáng)調(diào)

Strong: **Strong** or __Strong__ (Command-B)
Emphasize: *Emphasize* or _Emphasize_^[1] (Command-I)

4.4. 圖片

![](path/or/url/to.jpg "Optional Title")
![Alt Image Text][image-id]
on it's own line elsewhere:
[image-id]: path/or/url/to.jpg "Optional Title"

4.5. 表格

You can align cell contents with syntax like this:

The left- and right-most pipes (|) are only aesthetic, and can be omitted. The spaces don’t matter, either. Alignment depends solely on : marks.

4.6. 腳注

Text prior to footnote reference.[^2]
[^2] Comment to include in footnote.

H~2~O, X~long\ text~

H₂O

X_{long text}

5. 高級(jí)

5.1. 數(shù)學(xué)

$ 表示行內(nèi)公式：

質(zhì)能守恒方程可以用一個(gè)很簡潔的方程式 $E=mc^2$ 來表達(dá)。

$$ 表示整行公式：

$$E=mc^2$$

訪問 MathJax 參考更多使用方法。

5.2. 序列圖

主流支持seq，typora支持sequence

Alice->Bob: Hello Bob, how are you?
Note right of Bob: Bob thinks
Bob-->Alice: I am good thanks!

更多語法參考：序列圖語法

5.3. 流程圖

st=>start: Start
op=>operation: Your Operation
cond=>condition: Yes or No?
e=>end

st->op->cond
cond(yes)->e
cond(no)->op

更多語法參考：流程圖語法

5.4. Mermaid

Sequence

%% Example of sequence diagram
  sequenceDiagram

    Alice->>Bob: Hello Bob, how are you?
    alt is sick
    Bob->>Alice: Not so good :(
    else is well
    Bob->>Alice: Feeling fresh like a daisy
    end
    opt Extra response
    Bob->>Alice: Thanks for asking
    end

更多語法參考：Mermaid-Sequence

Flowchart

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

更多語法參考：Mermaid-Flowchart

Gantt

%% Example with slection of syntaxes
        gantt
        dateFormat  YYYY-MM-DD
        title Adding GANTT diagram functionality to mermaid
    
        section A section
        Completed task            :done,    des1, 2014-01-06,2014-01-08
        Active task               :active,  des2, 2014-01-09, 3d
        Future task               :         des3, after des2, 5d
        Future task2               :         des4, after des3, 5d
    
        section Critical tasks
        Completed task in the critical line :crit, done, 2014-01-06,24h
        Implement parser and jison          :crit, done, after des1, 2d
        Create tests for parser             :crit, active, 3d
        Future task in critical line        :crit, 5d
        Create tests for renderer           :2d
        Add to mermaid                      :1d
    
        section Documentation
        Describe gantt syntax               :active, a1, after des1, 3d
        Add gantt diagram to demo page      :after a1  , 20h
        Add another diagram to demo page    :doc1, after a1  , 48h
    
        section Last section
        Describe gantt syntax               :after doc1, 3d
        Add gantt diagram to demo page      : 20h
        Add another diagram to demo page    : 48h

更多語法參考：Mermaid-Gantt

6 其它

6.1. 語法表格列表

The following is a list of optional inline markups supported:

4You don't have to use a number. Arbitrary things like [^footy note4] and [^footy note4]: will also work. But they will render as numbered footnotes. Also, no need to keep your footnotes in order, I will sort out the order for you so they appear in the same order they were referenced in the text body. You can even keep some footnotes near where you referenced them, and collect others at the bottom of the file in the traditional place for footnotes.

Markdown支持以下這些符號(hào)前面加上反斜杠來幫助插入普通的符號(hào)：

\   反斜線
`   反引號(hào)
*   星號(hào)
_   底線
{}  花括號(hào)
[]  方括號(hào)
()  括弧
#   井字號(hào)
+   加號(hào)
-   減號(hào)
.   英文句點(diǎn)
!   驚嘆號(hào)

6.2. Jekyll front-matter

---
title: "Macdown is my friend"
date: 2014-06-06 20:00:00
---

6.3. 特殊符號(hào) HTML Entities Codes

? & ¨ ? ? ￡
& < > ￥ € ? ± ? § | ˉ ? ·

X2 Y3 ? ? × ÷ ?

18oC " '

6.4. Emoji表情 :smiley:

Blockquotes :star:

GFM task lists & Emoji & fontAwesome icon emoji & editormd logo emoji :editormd-logo-5x:

• [x] :smiley: @mentions, :smiley: #refs, links, formatting, and <del>tags</del> supported :editormd-logo:;
• [x] list syntax required (any unordered or ordered list supported) :editormd-logo-3x:;
• [x] [ ] :smiley: this is a complete item :smiley:;
• [ ] []this is an incomplete item test link :fa-star: @pandao;
• [ ] [ ]this is an incomplete item :fa-star: :fa-gear:;
  • [ ] :smiley: this is an incomplete item test link :fa-star: :fa-gear:;
  • [ ] :smiley: this is :fa-star: :fa-gear: an incomplete item test link;

1. If Underlines is turned on, _this notation_ will render as underlined instead of emphasized ?

2. If Underline is disabled _this_ will be rendered as emphasized instead of being underlined. ?

3. Quote replaces literal " characters with html <q> tags. Quote and Smartypants are syntactically incompatible. If both are enabled, Quote takes precedence. Note that Quote is different from blockquote, which is part of standard Markdown. ?