owned this note changed 4 years ago

為什麼要學 HackMD

  • 線上筆記,可跨平台
  • 支援多人協作服務,也可作為簡單的筆記軟體,用以寫工作日誌、筆記、共筆
  • 可使用標籤(tag)進行分類與管理
  • Marker好幫手,支援程式碼跟語法,例如 C、shell、YAML、MathJax、Uml etc.
  • 提供「簡報模式」跟「書籍模式」
  • 請支持國產優質筆記 ( github 可找到其 source code )

什麼是 Markdown

  • Markdown 是一種輕量級標記式語言, 它有純文字標記的特性,讓編寫的可讀性提高,這是在以前很多電子郵件中就已經有的寫法,而目前也有很多網站都使用 Markdown 來撰寫說明文件或是在論壇上發表文章與發送訊息

  • 相較 HTML 之下,不會夾雜很多不必要的標籤,讓可讀性提高。不需要像程式碼一樣縮排。



標題

Heading

Heading

Heading

Heading

Heading


基本文字編輯

上標上標 下標下標

  • 基本文字編輯
  • 粗體
  • 斜體
  • 刪除線
  • Highlight
  • 上標上標
  • 下標下標
  • 平仮名ひらがな
  • down stringupper string

程式碼

int i;
showTime(1,sleepT,"usleep"); for (int i = 0; i < sleepLoop; ++i) { usleep(sleepMs * 1000); // wait }

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 →
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 →

完整清單

ps: 實測結果,不是每個都可以正常顯示


警告區塊

裡面可以嵌入 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 →
這是訊息

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 →
喔不


插入圖片

250x300 表示圖片 寛x長

或用 =10%x 表示比例大小

插入影片 或 投影片

youtube

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 →

Workground for Github

  1. 範例: https://www.youtube.com/watch?v=8pXFktAbx5Y
  2. 取得封面 URL: https://img.youtube.com/vi/8pXFktAbx5Y/sddefault.jpg (參考)
  3. 製作一個 "圖片超連結"
[![](圖片url)](youtube URL)

圖片中嵌入文字

語法:

https://demo.sirv.com/oman.jpg?text=openlab_%22%E4%BC%B4%E4%BC%B4%E5%AD%B8%22

效果:

  • 中文無法顯示

_text->image_

  • 字型大小會等距拉寬至圖片寬度

slideshare

PDF

注意:請使用 https 的網址,否則可能會被您的瀏覽器阻擋載入


插入表格

heading
Deveui 000008fffe063800
appskey 1024f9a17f544cabaa21dc2500000000
nwkskey aed9c85f49b9402dbaae7af200000000
appeui 0000000000000000
Deveui 000008fffe063800
appskey 1024f9a17f544cabaa21dc2500000000
nwkskey aed9c85f49b9402dbaae7af200000000
appeui 0000000000000000

向右對齊

Deveui 000008fffe063800
appskey 1024f9a17f544cabaa21dc2500000000
nwkskey aed9c85f49b9402dbaae7af200000000
appeui 0000000000000000

置中

Deveui 000008fffe063800
appskey 1024f9a17f544cabaa21dc2500000000
nwkskey aed9c85f49b9402dbaae7af200000000
appeui 0000000000000000

註腳

註腳 1 連結[1].

註腳 2 連結[2].

行內註腳[3] 定義

重複的註腳參考[2:1].

定義清單

名詞 1

定義 1 快速連續項目

名詞 2 加上 行內標記

定義 2

​​​​​​  { 這些程式碼屬於 定義 2 的一部分 }

定義 2 的第三段落

緊密樣式:

名詞 1
定義 1
名詞 2
定義 2a
定義 2b

縮寫

這是 HTML 的縮寫範例 它會轉換 "HTML",但是縮寫旁邊其他的部分,例如:"xxxHTMLyyy",不受影響


共享筆記

如何分享

看誰在編輯?!

comment

Bruce Ke


引用 留言

helloBruce Ke

筆誤! 正確書寫方式訂正 "Bruce"Sun, Jun 28, 2020 10:00 PM


引用

巢狀引用區塊


繪圖

pie

title 2020年台灣發電結構與再生能源發電種類占比
"再生能源" : 5.4
"核能" : 11.24
"燃氣" : 35.7
"燃煤" :  45.02
"燃油" :  1.52
"抽蓄水力" :  1.13

更多繪圖


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 →
其實,小數點不用自己精算,但加起來還是要100喔。

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 →
更多數學式跟圖表的世界,可以到這裡探索。


\(\LaTeX\) 語法與示範

Latex 介紹

在 HackMD 中,必須以$包圍住才會認得是 \(\LaTeX\) 語法 (需緊鄰著數學式,中間不能有任何空白鍵)

e.g.

\(x\times 3^0 + x\times 3^1 + x\times 3^2\)

\[ { a+b \brace c+d } \]

\[ \overline{AB} \]

Ref:

1). \(\LaTeX\) 語法筆記

https://hackmd.io/@sysprog/gnu-linux-dev/https%3A%2F%2Fhackmd.io%2Fs%2FB1RwlM85Z

2). https://hackmd.io/s/MathJax-and-UML-tw


image alt


  1. 註腳 也可以標記 還可以有很多段落 ↩︎

  2. 註腳 文字 ↩︎ ↩︎

  3. 行內註腳的文字 ↩︎

Select a repo