テーブル

テーブル

Markdown 拡張機能 のすべてに加えた、標準の GFM パイプテーブルです - bxsites.yaml の設定は不要で、常に有効です:

| Feature      | Community | Enterprise |
| ------------ | :-------: | ---------: |
| Themes       |    10     |         10 |
| Multi-locale |    Yes    |        Yes |
| Support      |  Forums   |     24/7   |

これは次のようにレンダリングされます:

見出しの下にある --- の行がテーブルを有効にします。その区切り行にコロンを 付けることで、列ごとの配置を制御できます - :--- は左寄せ、:---: は 中央寄せ、---: は右寄せです（コロンをまったく付けない場合はすべての列が 左寄せになります）。

セルの内容は通常のインライン Markdown

code、太字、斜体、リンク は、ページの他の場所と まったく同じように、セルの中でもそのまま使えます:

| Setting | Value |
| --- | --- |
| Default theme | `bootstrap` |
| Docs | [Themes guide](themes.md) |
| Status | **Stable** |

これは次のようにレンダリングされます:

セル内のパイプをエスケープする

セル自身のプレーンテキストの中にあるリテラルな | はバックスラッシュ （\|）が必要です - エスケープされていない | は次の列の区切りとして 読み取られてしまいます:

| Expression | Meaning |
| --- | --- |
| a \| b | bitwise OR |

これは次のようにレンダリングされます:

インラインコードの中の | はまったくエスケープが不要です - コードスパン （`a | b`）がすでにそれを保護しているためです:

短い行と長い行

データ行は見出しの列数と厳密に一致していなくても構いません - 短い行は空の セルで埋められ、長い行は余分なセルが黙って破棄されます。どちらも下記の tableOptions.appendMissingColumns/discardExtraColumns で制御されます:

| One | Two | Three |
| --- | --- | --- |
| a | b |
| c | d | e | f |

これは次のようにレンダリングされます:

パース設定

短い行/長い行の扱い、--- 区切り行自体の厳密さ、そしてレンダリングされる すべての <table> が持つ CSS クラスは、いずれも bxsites.yaml の markdown.tableOptions で制御されます - このページ全体で示しているデフォルト値でほとんどの場合は十分です。

レスポンシブなスクロールと固定ヘッダー

レンダリングされる各テーブルは、bxsites.yaml の設定も追加の markdown も不要で、 自動的に .bxsites-table-wrap div でラップされます。これにより、幅の広い テーブルはページ全体からはみ出す代わりに独自の横スクロールバーを持ち、丈の高い テーブルは（max-height を超えた分だけ）固定の高さに収められて独自の縦スクロール バーを持ち、見出し行はその場に固定されたまま本文だけが下でスクロールします - 上記のような短いテーブルは、すでに収まっているため、スクロールバーがまったく 生成されません。カスタムの theme/ オーバーライドは、他の CSS クラスと同様に .bxsites-table-wrap（とりわけその max-height）を再スタイリングできます。

プレーンなデータの先へ

プレーンなテーブルの上に、さらに次の2つのレシピを直接組み合わせられます:

• GitBook の Select/Rating テーブル列にもっと近いもの - セル内のステータス チップやスターレーティング - が必要ですか？ビジュアライザーのレシピ を参照してください。
• 読者に実際にテーブルをクライアントサイドでソート・フィルタさせたい、 単に読ませるだけでは足りない場合は？ソート・フィルタ可能なテーブル を参照してください。