Markdownで表を作るには:構文、配置、セル内の改行。
Markdownの表はプレーンテキストです。セルをパイプで区切り、見出しの下にハイフンの行を置きます。ここでは構文と列の揃え方、そしてセルにパイプや2行目を入れる方法を説明します。
macOS 14以降。閲覧は無料で、編集とレビューは1回のお支払いです。
要点
見出し行を書き、次にハイフンの区切り行、そのあとに1行につき1行分のデータを、セルの間に|を入れて書きます。区切り行のコロンで列の配置が決まります。:---は左揃え、:---:は中央揃え、---:は右揃えです。セル内にパイプを表示するには\|と書き、セル内で改行するには<br>と書きます。
| Plan | Price | Seats |
|:-----|------:|:-----:|
| Free | $0 | 1 |
| Team | $12 | 10 |
·
Markdownの表の基本構文
表はGitHub Flavored Markdown(GFM)の機能で、GitHub、GitLab、ほとんどのMarkdownアプリが採用しています。表に必要なものは3つです。
-
見出し行
列の名前をパイプで区切って書きます:
| Name | Role |。 -
区切り行
見出しのすぐ下に、列ごとにハイフンのまとまりを並べた行を置きます:
| --- | --- |。セルの数が見出しと同じでないと、表にならずただのテキストのままになります。 -
データ行
1行が表の1行です。セルはパイプで区切ります。セルが足りない行は空のセルで埋められ、多い分は切り捨てられます。表は最初の空行で終わります。
| Name | Role |
| ----- | -------- |
| Alice | Designer |
| Bob | Engineer |
読み手には次のように見えます。
| Name | Role |
|---|---|
| Alice | Designer |
| Bob | Engineer |
各行の先頭と末尾のパイプは省略できますが、あるほうが読みやすくなります。ソースで列を揃える必要はありません。上の余白は人が読むためだけのものです。セルには太字、斜体、コード、リンク、画像を入れられます。
Markdownの表の配置
列のハイフンの左端、右端、または両端にコロンを付けます。
| 区切り行 | 配置 |
|---|---|
:--- | 左揃え |
:---: | 中央揃え |
---: | 右揃え |
--- | 指定なし(多くのアプリで左揃え) |
| Item | Qty | Price |
|:-------|:---:|------:|
| Pencil | 12 | $1.50 |
| Ruler | 3 | $4.00 |
| Item | Qty | Price |
|---|---|---|
| Pencil | 12 | $1.50 |
| Ruler | 3 | $4.00 |
配置は見出しを含む列全体に適用されます。設定は区切り行で1回だけ行い、セルごとには指定しません。数字は右揃えにすると桁がそろいます。
セル内のパイプと改行
パイプはセルの終わりを意味するので、文字としてのパイプにはバックスラッシュが必要です。GFMでは、インラインコードの中でもこれが必要です。
| Command | Meaning |
|--------------------|------------------|
| `a \| b` | a pipe, in code |
| Either \| or | a pipe, in text |
パイプ形式の表は1行が1行分なので、セルの中に本物の改行や2つ目の段落は入れられません。ふつうはHTMLタグの<br>で回避します。
| Step | What to do |
|-------|-------------------------------------|
| Build | Run the build.<br>Fix any errors. |
| Ship | Tag the release.<br>Push the tag. |
同じ方法で、GitHubやHTMLを受け付けるほとんどのアプリで、セル内を複数行にできます。セル内ではMarkdownのリストは使えません。リストが必要なら、短い項目の間に<br>を入れるか、リストを表の外に出してください。
幅の広い表と長い文章
Markdownには列幅の指定もセルの結合もありません。表がどう収まるかは、表示するアプリが決めます。次のことを心がけると、どこでも読みやすい表になります。
- セルは短く、単語か数字ひとつにします。長い説明は表の下の文章に書きます。
- 列を減らします。8列あるなら、列と行を入れ替えて、列を項目、行を属性にします。
- よく編集する表では、ソースの列を空白で揃えないでください。セルを1つ変えるたびに全行の余白を直すことになります。
- セルの結合、行の結合、キャプションが必要なときは、表をHTMLで書きます。ほとんどのMarkdownアプリは素の
<table>を表示します。
Markdownの表が表示されないとき
- 区切り行がない。ハイフンの行があって初めて、テキストが表になります。
- セルの数が合っていない。見出しが3セルで区切り行が2セルだと、何も表示されません。
- エスケープしていないパイプがセル内にあると、セルが2つに分かれます。
\|と書きます。 - 表の途中の空行。表はそこで終わり、残りはただのテキストになります。
- アプリが表に対応していない。表は元のMarkdownにもCommonMarkの中核にも含まれません。GFMで加わったものなので、最小限のパーサーではパイプが文字のまま表示されます。
コミットする前に結果を確認するには、ファイルをMarkdownリーダーで開きます。DotMDは表を整形して表示でき、閲覧は無料です。DotMD Editorでは、Insert → Tableで3列の表がファイルに挿入され、ライブプレビューが入力に合わせて描き直します。
Markdownの表に関するよくある質問
Markdownの表で文字を揃えるには?
見出しの下の区切り行(ハイフンの行)にコロンを付けます。:---で列が左揃え、:---:で中央揃え、---:で右揃えになります。
Markdownの表のセル内で改行するには?
改行したい位置に<br>を書きます。パイプ形式の表は1行が1行分なので、本物の改行やセル内のMarkdownのリストは使えません。
表のセルにパイプ文字を入れるには?
バックスラッシュでエスケープして\|と書きます。通常のテキストでもインラインコードの中でも必要です。
Markdownの表でセルを結合できますか?
できません。GFMの表にはcolspanもrowspanもありません。セルの結合が必要なら、<table>、colspan、rowspanを使ってHTMLで表を書きます。