Markdown 速成

知道初學 Markdown 應該掌握的重點-產生的 HTML 及其背後的語意之後,這一節將快速走過所有 Mardown 的用法,但不會說明太多細節,目標是對 Markdown 可以做到什麼有初步的瞭解。

Tip
這裡只提供 Markdown 及產生的 HTML,方便觀察其間的對應關係,若要看實際在瀏覽器上的表現,把 Markdown 文件貼到 Markdown Digus 即可。

標題 (Header)

標題分為六級 (<h1> ~ <h6>),前面兩級可以分別在標題下面加上一或多個等號 (=) 跟減號 (-)。例如:

標題一
======

標題二
------

結果:

<h1>標題一</h1>

<h2>標題二</h2>

另一種寫法是在標題前面加上 1 ~ 6 個 #,分別對應 <h1> ~ <h6>。例如:

# 標題一
## 標題二
### 標題三
#### 標題四
##### 標題五
###### 標題六

結果:

<h1>標題一</h1>

<h2>標題二</h2>

<h3>標題三</h3>

<h4>標題四</h4>

<h5>標題五</h5>

<h6>標題六</h6>

段落 (Paragraph)

連續的行會形成一個段落 (<p>),段落之間用一或多個空白行隔開。例如:

連續的行,行1
行2
行3
會形成一個段落。

隔了一個空白行之後,又是另一個段落,行1
行2
行3

結果:

<p>連續的行,行1
行2
行3
會形成一個段落。</p>

<p>隔了一個空白行之後,又是另一個段落,行1
行2
行3</p>

強調 (Emphasis)

要在一個句子裡強調某個字詞時 (<em>),前後用 _* 包夾起來即可。例如:

雞蛋不要放在_同一個_籃子裡。

結果:

<p>雞蛋不要放在<em>同一個</em>籃子裡。</p>

重點 (Importance)

要在整份文件裡突顯某一段文字的重要性時 (<strong>),前後用 __** 包夾起來即可。例如:

... **觀察 Markdown 語法產生的 HTML,是一種很好的學習方式**,可以試著調整 Markdown
的寫法,並觀察 HTML 是否會跟著產生變化,尤其是文字說明不清楚的地方,試就對了。...

結果:

<p>... <strong>觀察 Markdown 語法產生的 HTML,是一種很好的學習方式</strong>,可以試著調整 Markdown
的寫法,並觀察 HTML 是否會跟著產生變化,尤其是文字說明不清楚的地方,試就對了。...</p>

程式碼 (Code)

行內 & 區塊兩種用法

清單 (List)

連結 (<a>) 有兩種寫法,一種是 [{link_text}](url),將 URL 寫在行內 (inline-style)。例如:

[在電梯裡遇見雙胞胎](https://imsardine.wordpress.com/)

另一種 [{link_text}][{link_name}] 則是把 URL 提出去 (reference-style),另外用 [{link_name}]: {url} 宣告。例如:

[在電梯裡遇見雙胞胎][myblog]

[myblog]: https://imsardine.wordpress.com/

兩種寫法的結果都是:

<p><a href="https://imsardine.wordpress.com/">在電梯裡遇見雙胞胎</a></p>

圖片 (Image)

網址/郵件地址

引用 (Quotation)

跟電子郵件往返時一樣,前面整排的 > 表示引用之前的討論或其他地方的內容 (<blockquote>)。例如:

> 腦袋不是用來裝東西,而是用來思考問題的;所以我把懶得記的、記不住的,通通寫在這裡...
>
> [在電梯裡遇見雙胞胎](https://imsardine.wordpress.com/)

結果:

<blockquote>
  <p>腦袋不是用來裝東西,而是用來思考問題的;所以我把懶得記的、記不住的,通通寫在這裡...</p>

<p><a href="https://imsardine.wordpress.com/">在電梯裡遇見雙胞胎</a></p>
</blockquote>

跳脫 (Escaping)

results matching ""

    No results matching ""