如何建立表格
工具列的表格快捷鍵
建立一個 Markdown 表格最簡單的方式,就是按下編輯器工具列的表格圖示 :
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 →
Markdown 表格表示法
Markdown 的表格由以下方式表示:
- 我們用 | 和 - 來繪製 Markdown 表格
- 第一列為標題列,Markdown 表格用標題列的欄數決定這個表格的欄數
- 第二列的欄位需要包含 -,並用 | 分隔
- 用 | 分隔每欄
- 用換行來建立新的一列
範例
| 名稱 | 數量 |
| ----- | -------- |
| 蘋果 | 3 |
| 雞蛋 | 12 |
以上 Markdown 語法會產出一個兩欄三列的表格:
進入表格編輯模式
HackMD 讓編輯 Markdown 表格更方便好用,為此我們設計了全新的表格工具列:
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 →
我們可以用兩種方法進入表格編輯模式:
- 輸入 | 建立新表格 (鍵盤按下 shift + \)
- 或是遊標選取現有的表格
表格工具列
現在您已經進入表格編輯模式了,讓我們介紹表格工具列的使用方法。
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 →
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 →
基礎快速鍵
Tab 移動到下一個單元格
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 →
Shift + Tab 移動到前一個單元格
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 →
Enter 移動到下一列 (macOS 為鍵盤上的 Return)
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 →
Ctrl + Enter 跳出表格編輯模式 (macOS 為 Command + Return 鍵)
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 →
Ctrl + 方向鍵 移動單元格焦點 (macOS 為 Command 鍵)
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 →
啟用表格快速鍵後,將同時啟用「自動格式化表格」功能,當一個表格欄位長度過長時,可能會如下圖一樣「爆版」:
此時您可以將從狀態列的選單將「啟用自動換行」取消勾選,確保 Markdown 表格能漂亮的在編輯區顯示:
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 →
附錄:完整快速鍵對應表
若作業系統為 macOS,記得將以下快速鍵表中的 Ctrl 鍵替換為 Command 鍵。
基本快速鍵
指令 |
描述 |
快速鍵 |
下一單元格 |
移動到下一個單元格 |
Tab |
前一單元格 |
移動到前一個單元格 |
Shift-Tab |
下一列 |
移動到下一列 |
Enter |
跳出 |
從表格編輯模式中跳出 |
Ctrl-enter |
移動焦點
指令 |
描述 |
快速鍵 |
向左移動 |
向左移動焦點 |
Ctrl-Left |
向右移動 |
向右移動焦點 |
Ctrl-Right |
向上移動 |
向上移動焦點 |
Ctrl-Up |
向下移動 |
向下移動焦點 |
Ctrl-Down |
對齊方式
指令 |
描述 |
快速鍵 |
靠左對齊 |
將該欄靠左對齊 |
Shift-Ctrl-Left |
靠右對齊 |
將該欄靠右對齊 |
Shift-Ctrl-Right |
置中對齊 |
將該欄置中對齊 |
Shift-Ctrl-Up |
取消對齊 |
取消已經設定的對齊方式 |
Shift-Ctrl-Down |
列/欄操作
指令 |
描述 |
快速鍵 |
插入列 |
插入一個空列 |
Ctrl-K Ctrl-I |
刪除列 |
刪除目前所在的列 |
Ctrl-L Ctrl-I |
插入欄 |
插入一個空欄 |
Ctrl-K Ctrl-J |
刪除欄 |
刪除目前所在的欄 |
Ctrl-L Ctrl-J |
上移列 |
上移目前所在的列 |
Alt-Shift-Ctrl-Up |
下移列 |
下移目前所在的列 |
Alt-Shift-Ctrl-Down |
左移欄 |
左移目前所在的欄 |
Alt-Shift-Ctrl-Left |
右移欄 |
右移目前所在的欄 |
Alt-Shift-Ctrl-Right |
感謝
HackMD 表格編輯功能在 1.10 版 釋出,特別感謝 susisu 開源的 markdown-table-editor kernel 套件,讓我們得以實作表格編輯器功能。
此表格編輯器功能也同時在 CodiMD 1.4.0 版本開源釋出,詳見 hackmdio/codimd/#1300 的實作。