owned this note   changed a month ago  
Published Linked with GitHub

點我

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 →
回到 HackMD 教學首頁

點我

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 →
給予建議 或回報BUG

將文字，畫上螢光筆

把字串的前後標在四個等號中間 ==要標色的字== 就會有螢光筆的效果！

像這樣

強調內容，放在色塊裡

在一個空白行，打上三個冒號 ::: 之後會出現「色塊」選單。

success / info / warning / danger 分別會對應不同顏色。

Image Not Showing Possible Reasons
  • The image was uploaded to a note which you don't have access to
  • The note which the image was originally uploaded to has been deleted
Learn More →

上下各三個 ::: 之間的內容，就是色塊裡的內容。

強調色塊，共有四種樣式

:::success

在編輯頁面打上 :::success 會出現綠色的色塊，長這樣：

success 綠色色塊裡面的文字

:::info

在編輯頁面打上 :::info 會出現藍色的色塊，長這樣：

info 藍色色塊的文字，框框裡的字也會變色

:::warning

在編輯頁面打上 :::warning 會出現黃色的色塊，長這樣：

warning 黃色色塊的文字，裡面也還支援 md 基本語法，像是標題

H2 標題

:::danger

在編輯頁面打上 :::danger 會出現紅色的色塊，長這樣：

danger 的紅色色塊文字，文字也還可以標粗體

或是引用

  • 或是項目符號

功能延伸學習

假如您想要在一個色塊中包含另一個色塊，要怎麼實現呢？又或是，您想要在一個色塊中加入下面的收合箭頭？

在 Markdown 中您可以透過輸入不同色塊層級來客製化你想要的呈現方式。

您已經學會使用三個冒號 :::warning 和 ::: 創建一個色塊，那請您在它的外層前後多加一組四個冒號的 ::::info 和 :::: ，就像洋蔥一樣，一層一層的呈現您的色塊。

例如：

::::info

在藍色色塊中
:::danger
插入一個紅色色塊
:::
並且色塊前後還能寫其他內容
::::

在藍色色塊中

插入一個紅色色塊

並且色塊前後還能寫其他內容

收合箭頭，讓版面更整潔

在編輯頁面打上 :::spoiler 會出現帶有三角箭頭的字串。

實際呈現如下，您可以試著點擊三角箭頭展開。

直接輸入內文即可，箭頭旁的預設文字是「詳細資料」

打開我

你也可以在 :::spoiler 之後輸入一個空格，接著想要的標題文字，就能編輯三角箭頭旁的文字。

也可以加上引用
或粗體、斜體、螢光筆

引用警示 GitHub Alert

在編輯頁面打上 >[!] ，HackMD 會自動讀取區塊引用警示選單，你可以選擇想要套用的樣式

image

引用警示總共有五種樣式

你可以依據不同情境選擇要使用的樣式，預設的警示文字是英文，你可以直接在>[!NOTE]的後面接著輸入想要替換的文字，以藍色的警示為例：

> [!NOTE]註
> 這篇筆記收錄在 HackMD 教學手冊當中，集所有的教學為一身，快收藏訂閱吧！

註

這篇筆記收錄在 HackMD 教學手冊當中，集所有的教學為一身，快收藏訂閱吧！

其他的引用警示類型還有…

小提醒

往下滑動點擊【用雙欄模式，觀看本篇筆記的原始語法】可以開啟雙欄模式看我們怎麼寫的

很重要

寫下你想要幫助讀者達成目標、專案目的的重要資訊

超急！！！

拜託 Angel 大大先幫我產出下週的廣告素材，我會請你喝飲料的～

危險勿動

此區塊涉及後台數據，非管理人員請勿操作！

 

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 →
建議用雙欄模式，觀看本篇筆記的原始語法，即可一目瞭然！

Select a repo