Image Not Showing Possible Reasons

• The image file may be corrupted
• The server hosting the image is unavailable
• The image path is incorrect
• The image format is not supported

Learn More →

常用Markdown語法與HackMD的擴充

• 標題
• 清單
• 字體變化
• …

標題

• 簡報名稱預設為最大字體的標題一
  • 以# 開頭（半形井號加一個空白）
• 次要標題可以用標題二## 或標題三##
• 標題一至標題六，字體由大到小
• ###### tags: 設定筆記的標籤

# 這是標題一：最大字體

這是標題一：最大字體

## 這是標題二：次大字體

這是標題二：次大字體

### 這是標題三

這是標題三

#### 這是標題四

這是標題四

##### 這是標題五

這是標題五

###### 這是標題六

這是標題六

清單（列表）

1. 無序清單用半形星號、加號或減號，再一個空白
2. 有序清單用數字、點（或右括號）與空白
   • 如1. 、2. 、3，)
   • 數字不拘，系統會自行排序
3. 待辦清單：清單後面再加中括號與空白或x(小寫)
   • 如- [ ] Todo item 1
   • 如- [x] Todo item 2

• 按Tab或2個空白形成第二層清單

無序清單

* 第1點
    * 第1.1點
    * 第1.2點
    * 第1.3點
* 第2點
* 第3點

• 第1點
  • 第1.1點
  • 第1.2點
  • 第1.3點
• 第2點
• 第3點

有序清單

1. 第1點
    1. 第1.1點
    2. 第1.2點
1. 第2點    
5. 第3點

另一段：
  
16. 第16點
1. 第17點

1. 第1點
   1. 第1.1點
   2. 第1.2點
2. 第2點
3. 第3點

另一段：

16. 第16點
17. 第17點

待辦清單

• 買啤酒
• 買牛奶
• 買尿布
• x要用小寫

引用(Quote)

• 以大於與空白> 表示
• >> 第二層引用
• >>> 第三層引用
• 以此類推

擴充語法

• > [name=姓名] [time=時間] [color=顏色碼]

引用(Quote)

Steve Jobs told: 
> 1. Stay hungry. Stay foolish.
> [name=史提夫·賈柏斯] [time=June 12, 2005] [color=red]
>> 2.「如果每個人都要去舊金山，那麼，花許多時間*爭執*走哪條**路並不是問題**。但如果有人要去舊金山，有人要去聖地牙哥，這樣的爭執就很浪費時間了。」[color=purple]

Steve Jobs told:

1. Stay hungry. Stay foolish.
   史提夫·賈柏斯June 12, 2005

2.「如果每個人都要去舊金山，那麼，花許多時間爭執走哪條路並不是問題。但如果有人要去舊金山，有人要去聖地牙哥，這樣的爭執就很浪費時間了。」

字體變化

• 斜體：一個星號或底線
• 粗體：兩個星號或底線
• 刪除線：兩個Tilde(波浪號)
• 底線：兩個加號
• 高亮：兩個等號
• 上標：兩個^，如 1024^16^=1024¹⁶
• 下標：兩個~，如 H~2~O~2~=H₂O₂

字體變化

* 斜體：*一個星號或底線*
* 粗體：**兩個星號或底線**
* 刪除線：~~兩個Tilde(波浪號)~~
* 底線：++兩個加號++
* 高亮：==兩個等號==
* 上標：兩個`^`，如 `1024^16^`=1024^16^
* 下標：兩個`~`，如 `H~2~O~2~`=H~2~O~2~

Emoji (繪文字，表情符號)

• 格式：用兩個冒號夾住，:Emoji代碼:
  Image Not Showing Possible Reasons

  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported

  Learn More →
  Image Not Showing Possible Reasons

  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported

  Learn More →
  :tada: :heart:
• Emoji代碼清單

程式碼

• 文字之間使用：前後用一個倒引號(`，Back-quote)夾住
• 一段獨立指令碼區塊
  • 第一行與最後一行用三個倒引號開頭
  • 第一行倒引號後面可以接程式語言名稱
  • 程式語言名稱=則會以語法強調格式呈現
  • 程式語言名稱=開始行號：行號1由指定行號開始

用```java=

public static void main(String[] args) throws Exception {
  System.out.println("Hello World!");
}  

用```java=120

public static void main(String[] args) throws Exception {
  System.out.println("Hello World!");
}  

連結與圖片

• 連結格式：[文字](網址)或[文字](網址 "提示文字")
• 圖片格式：![文字](網址)或![文字](網址 =寬x高)

相關網址：[簡睿隨筆](http://jdev.tw/blog "技術分享的網站，歡迎參觀")
相關網址：簡睿隨筆

![markdown.tw](https://markdown.tw/images/208x128.png) ![markdown.tw](https://markdown.tw/images/208x128.png =48x48)

參考式連結

• 連結格式：[文字][參考代碼] ➡ 文字
• 需要重覆使用的超連結即可使用此語法
• 縮寫：遊標顯示提示文字（前後要有空白），如：使用 Markdown 語法，語法：*[Markdown]:

[參考代碼]: https://jdev.tw
*[Markdown]: 一個輕量的標記語言

註腳

• 格式：附註[^註腳自訂代碼] ，如:附註^[1]

[^註腳自訂代碼]: 註腳說明

外部資源參考

• 格式：{%資源名稱 參考代碼 %}

資源名稱

• youtube

• vimeo

• gist

• slideshare

• speakerdeck

• pdf

• hackmd 引入HackMD的另一篇筆記
  {% hackmd S1rGsKHVS %}

YouTube影片

{%youtube UF8uR6Z6KLc %}

圖表功能

以下圖表功能請參考官方教學文件

• MathJax
• UML循序圖
• 流程圖
• Graphviz
• 五線譜

提示區塊

• 格式：
  • 第一行是:::提示種類
  • 最後一行是:::
• 提示種類：
  • success
  • info
  • warning
  • danger

:::info ... :::

:::danger ... :::

表格

• 簡單格式：用 | (pipe or bar)分隔

表頭1 | 表頭2 | 表頭3
--- | --- | ---
(1,1) | (1,2) | (1,3)
(2,1) | (2,2) | (2,3)
(3,1) | (3,2) | (3,3)

表格（續）

• 複雜格式 (左靠，置中，右靠)

| 表頭1 | 表頭2 | 表頭3 |
|:---|:---:|---:|
| 1 | 2 | 3 |
| 4 | 5 | 6 |
| 7 | 8 | 9 |

參考

• 支援的YAML選項
• 數學式與圖表
• Emoji清單