# HackMD 教學
###### tags: `HackMD`

## Reference
1. [HackMD 快速入門教學](https://hackmd.io/c/tutorials-tw/%2Fs%2Fquick-start-tw)
2. [插入程式碼](https://hackmd.io/c/tutorials-tw/%2Fs%2Fhow-to-use-code-blocks-tw)
3. [撰寫數學式及圖表](https://hackmd.io/MathJax-and-UML-tw?both)

## 練習場

### 多行程式碼

print("Hello World!")

### 單行程式碼

這可以用來印出Hello World: ``print("Hello World!")``

---

### 截圖練習


---

### 改顏色練習
1. HTML 的 font 元素

H<font color="#f00">e</font>llo, World

H<font color="#f00">e</font>llo, World

:::success
需要另查[色碼](https://htmlcolorcodes.com/color-picker/)
:::

2. CSS Class

<style>
.blue {
  color: blue;
}
</style>

Hello, <span class="blue">World</span>

<style>
.blue {
color: blue;
}
.red{
color: red;
}
</style>

Hello, <span class="blue">World</span>
<span class="red">change</span>

:::info
style 寫過後面就可以用了 可以放在最前面
:::

---

### 數學式練習

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

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

### 循序圖

艾莉絲->包柏: 哈摟，你好嗎？
Note right of 包柏: 包柏思考中
包柏-->艾莉絲: 我很好，謝謝！
Note left of 艾莉絲: 艾莉絲回應
艾莉絲->包柏: 最近過得怎樣？