# 設定：囲み

> :::calloutの囲みに付ける名前付きスタイル：枠線、背景、帯、タイトル、アイコンと外側のマーカー、番号付きの定理、囲みの中の文字組み、ページをまたいで分割された囲み

- HTML版: https://postext.dev/ja/docs/configuration-callouts
- 最終更新: 2026-10-16
- 読了時間: 26分
- 他の言語: [en](https://postext.dev/en/docs/configuration-callouts.md), [es](https://postext.dev/es/docs/configuration-callouts.md), [ca](https://postext.dev/ca/docs/configuration-callouts.md), [de](https://postext.dev/de/docs/configuration-callouts.md), [fr](https://postext.dev/fr/docs/configuration-callouts.md), [it](https://postext.dev/it/docs/configuration-callouts.md), [pt](https://postext.dev/pt/docs/configuration-callouts.md), [zh](https://postext.dev/zh/docs/configuration-callouts.md), [ar](https://postext.dev/ar/docs/configuration-callouts.md)

## かんたんな説明

このページでは、注記、ヒント、警告、学習目標などを本文から切り離して見せる囲みを説明します。囲みの種類ごとに名前を付け、背景、枠線、色の帯、タイトル、アイコンといった見た目を決めます。教科書の定理や例題のように、囲みに番号を付けることもできます。囲みの中のフォントも選べます。長い囲みが次のページへ続くときは、その切れ目に何を示すかを選びます。

## 囲みスタイル

`calloutStyles`プロパティは、文書が`:::callout{type="…"}`コンテナーで適用する名前付きの囲みスタイルを宣言します。注記、ヒント、警告、学習目標など、色付きの背景や枠線で本文から切り離して組む内容に使います。既定では中立的なスタイル`note`が1つ用意されています（薄いグレーの背景、枠線・帯・アイコン・タイトルなし）。そのため`:::callout`は何も設定しなくても使えます。`calloutStyles`を宣言すると、この既定のリストは置き換えられます。

```ts
const config: PostextConfig = {
  calloutStyles: [
    { id: 'note', name: 'Note' },
    {
      id: 'objectives',
      name: 'Learning objectives',
      title: 'Objectives',
      stripe: { enabled: true, side: 'left' },
      icon: { kind: 'glyph', glyph: '✓' },
      titleStyle: { textTransform: 'uppercase' },
      lists: { bulletChar: '–' },
    },
    {
      id: 'warning',
      title: 'Warning',
      backgroundEnabled: false,
      border: { enabled: true, color: { hex: '#AA0000', model: 'hex' }, width: { value: 1, unit: 'pt' } },
      borderRadius: { value: 1, unit: 'mm' },
      titleStyle: { color: { hex: '#AA0000', model: 'hex' } },
    },
  ],
};
```

```md
:::callout{type="objectives"}
- Describe the parts of the lantern.
- Trim the wick at dusk.
:::

:::callout{type="warning" title="Do not touch the lens"}
The glass stays hot for an hour after the flame is out.
:::
```

| プロパティ | 型 | 既定値 | 説明 |
| --- | --- | --- | --- |
| `id` | `string` | — | `:::callout{type="…"}`で選ぶ識別子です。`type`が未知または欠けているフェンスには、設定した最初のスタイルが適用されます（未知のtypeはSandboxが警告します）。 |
| `name` | `string` | `id` | 人が読むための名前です（エディターのUIでのみ使います）。 |
| `title` | `string` | `''` | 既定のタイトルの文字列です。空ならタイトルはありません。フェンスの`title`属性で個別に上書きできます。 |
| `span` | `'column' \| 'page' \| 'side'` | `'column'` | 横方向の広がりです。段、版面の全幅、または1段半レイアウトのフロート専用のサイド段（`layout.sideColumnRole: 'floats'`）のいずれかです。サイド段のとき、囲みは流れから外れ、割り込んだ位置のテキストの横にあるその段に積まれます。`span`属性で個別に上書きできます。段組みのレイアウトでは`'page'`の囲みは*ページ幅のブロック*（span block）になります。ページを段の帯に分け、全幅の独自の段に収まります（後述のコンテナーの節を参照）。そのページのサイド段に収まらないサイド段の囲みは、次のページのサイド段に置かれます。その前に章（または文書）が終わると、待っている囲みはそれぞれ、フェンスの順に本文の後のページのサイド段に置かれ、ビルドがそれを知らせます（`afterText`。postext 1.24までは、そうした最初のページより後の囲みは失われていました）。 |
| `columns` | `number` | `1` | フロートする囲み（`placement`が`'auto'`、`'top'`、`'bottom'`のいずれかで、`span: 'column'`）がまたがる隣り合う段の数です。図の`placement.columns`と同じ働きで、新聞の5段のうち3段にまたがる記事の囲みなどに使います。ページの段数以上を指定すると、ページ幅の囲みになります。流れの中に組む囲み（`'here'`）は自分の段に収まります。インスタンスごとに`columns`属性で上書きできます。postext 1.18以降。 |
| `placement` | `'here' \| 'auto' \| 'top' \| 'bottom' \| 'fixed'` | `'here'` | 囲みを置く場所です。`'here'`は流れの中にそのまま組みます。`'top'`/`'bottom'`はリソースと同じように**フロート**として配置します（`'auto'`はページの上と下のうち先に空いた帯を使います）。囲みは現れた位置で流れから外れ、その位置以降で最初に空いている帯（現在のページの下、または流れが次に開くページの上か下）に入り、後に続くテキストがその周りのページを埋めます。`'fixed'`は後述の`fixed`でページ座標に固定し、段の流れから外します。詳しくはコンテナーの節を参照してください。`placement`属性で個別に上書きできます。 |
| `sideAtColumnEnd` | `'before' \| 'after'` | `'before'` | フェンスの後のテキストが同じ段で続かないときに、サイドの囲み（`span: 'side'`）を置く位置です。続かないのは、段にそのテキストの入る余地がないときや、改段・改ページの規則がテキストを先へ送るとき（ウィドウとオーファンの規則で段落ごと送られる場合、見出しが本文と一緒に送られる場合）です。`'before'`は囲みをフェンスの位置、つまりそのページで前のテキストの横に置きます。フェンスの下に収まらないときは段の下端からせり上げます。説明する箇所の後に書いた注釈に向いています。`'after'`はフェンスの後のテキストの最初の行と高さをそろえ、そのテキストが続くページのサイド段に置きます。行の前に書いた行番号や欄外見出しに向いています。テキストが同じ段で続くときは、どちらもフェンスの位置に置きます。章の中で後に何も続かない囲みは、どちらの場合も前のテキストとともに残り、続けて書いたサイドの囲みは順序を保ちます。postext 1.4まではすべてのサイドの囲みが`'before'`として動作しており、これが既定のままです。注釈用のスタイルでは、囲みは説明する箇所のページにとどまります。 |
| `fixed` | `{ anchor?, offset? }` | `{ anchor: { to: 'container', edge: 'bottom-left' } }` | `'fixed'`の囲みの位置です。`ElementAnchor`（`to`：`'container'`＝版面、偶数ページでは左右反転、`'page'`＝仕上がり枠、`'bleed'`＝裁ち落とし枠。`edge`：コンテナーの9つの基準位置のいずれか）と、省略できる`offset`（`x`/`y`の寸法）で指定します。 |
| `floatBarrier` | `boolean` | `false` | 囲みをフロートの区切りにします。囲みより前で参照された図や表は、すべて囲みより前に配置されます（ページの空き位置、なければ囲みより先に開くページ）。こうして、章を締めくくる囲み（典型的には「要点」のまとめ）を越えてフロートが流れ出ることはありません。章扉、`:::part`、文書の末尾は常に区切りになります。 |
| 段組みのページにある`span: 'page'`の囲みは、直前のテキストの下で帯を切ります。囲みより前で参照された全幅の図は、先にその切れ目を使います。テキストの段の高さをそろえ、テキストが終わった位置に図を置き、囲みはその下に続きます（収まらなくなったときは次のページへ送ります）。高さをそろえたテキストの後に収まらないほど高い図は次のページの先頭に置き、囲みはその後に続きます。図が抜けた帯も高さをそろえて終わります。分割できる囲み（`keepTogether: false`）は、テキストと図の下で、入るだけの項目を収めて始まり、残りは次のページに続きます。 |  |  |  |
| `width` | `'fill' \| 'auto'` | `'fill'` | `'fill'`は使える幅いっぱいに広がります。`'auto'`はタイトルに合わせて縮み（バッジ用）、子要素は無視します。 |
| `backgroundEnabled` / `background` | `boolean` / `ColorValue` | `true` / `#f4f4f4` | 囲みの塗りです。 |
| `border` | `{ enabled, color, width }` | `false`, `#cccccc`, `0.5pt` | 囲みの枠線です。ボックス要素の枠線と同じく、囲みの縁の内側に引きます（[ボックス要素](https://postext.dev/ja/docs/configuration-headers-footers.md#ボックス要素)を参照）。 |
| `borderRadius` | `Dimension` | `0` | 背景と枠線の角の半径です（囲みの幅と高さの半分までに制限されます）。帯もこれに従います。角の丸い囲みでは、CSSが`border-left`を`border-radius`で切り抜くのと同じように、帯を丸い枠で切り抜きます。`label`のタブは角を四角いまま保ちます。 |
| `padding` | `{ top, right, bottom, left }` | 各`0.75em` | 囲みの縁と内容の間の内側余白です。`em`の値は囲みの本文のサイズが基準です。 |
| `stripe` | `{ enabled, side, width, color }` | `false`、`'left'`、`1.5em`、メインカラー | 1辺に沿った塗りの帯です。`'left'`/`'right'`の帯は内容の幅を狭め、`'top'`の帯は内容を下へ押し下げます。`'left'`と`'right'`は本文の流れから見た側です（右から左の本では`'left'`は紙面の右になります）。`'start'`と`'end'`は囲み自身の方向に従うので、アラビア語の本の中の`:::callout{dir=ltr}`では`'start'`の帯は左に付きます。`borderRadius`のある囲みでは、帯の外側の角は枠と同じく丸くなります（postext 1.4までは四角いままで、丸みからはみ出していました）。 |
| `icon` | `{ kind, glyph, resourceId, fontFamily, fontWeight, size, width, color, align, position, cornerSide }` | `'none'`、見出しのフォント、`400`、`1.5em`、メインカラー、`'top'`、`'inline'`、`'right'` | 内容の横に置く、文字のグリフ（`kind: 'glyph'`）またはビットマップやSVGのリソース（`kind: 'resource'`＋`resourceId`）です。側辺に帯があるときアイコンは帯の上の中央に置き、帯がなければ専用の列（`size`＋`titleStyle.gap`）を確保します。`align: 'center'`は内容に対して縦方向の中央に置きます。リソースの画像は縦横比を保って正方形の中に収めます。`width`を設定すると`width`×`size`の枠の中に収めます（横長のアイコンの列など）。内容より高いアイコンは、囲みをその高さまで広げます（`align: 'center'`のときは内容をアイコンの中央にそろえます）。`position: 'corner'`はアイコンをバッジとして上の角に掛け、半分を枠の外に出し、内容の場所は取りません。横長のアイコン（`width`）は描画される幅を基準に角の中央に置き、左の角ではタイトルをアイコンの内側の半分より先から始めます（postext 1.4までは高さを基準に置いていたため、横長の列が囲みからはみ出してタイトルに重なっていました）。`cornerSide`は角を選びます。`'right'`/`'left'`、または左右対称の余白のページの奇偶に従う`'outer'`/`'inner'`です（outerは奇数ページでは右、偶数ページでは左）。 |
| `marker` | `{ kind, glyph, resourceId, fontFamily, fontWeight, size, color, align, gap, rule }` | `'none'`、見出しのフォント、`400`、`1.5em`、メインカラー、`'center'`、`0.5em`、罫線なし（`0.5pt`、メインカラー、長さ`0`） | 囲みの*外*、左側の列に描く2つ目のアイコンです。囲みとの間に縦の`rule`を引くこともできます。自己評価のバッジの横に置く「ここをタップ」の手のマークなどに使います。全体の枠は`[marker][rule][gap][box]`となり、高さは3つのうち最も高いものに合わせます。`align`はそれらを互いの中央にそろえるか、上端にそろえます。`rule.length`は最小値で、罫線は常に少なくとも囲みの高さ分の長さになります。 |
| `titleStyle` | `{ fontFamily, fontSize, fontWeight, italic, color, textTransform, gap, letterSpacing, indent, lineHeight }` | 見出しのフォント、本文のサイズ、`700`、`false`、メインカラー、`'none'`、`0.5em`、`0`、`0`、`1.2em` | タイトルの文字組みです。`gap`はタイトルと最初の子要素の間のアキです（アイコンの列とのアキにもなります）。`lineHeight`はタイトルの行送りで、`em`はタイトル自身のサイズが基準です。本文と同じく、ベースラインは各行の上から行送りの0.8の位置に来ます。そのため本文の行送りに合わせたタイトル（12 ptのグリッドで`lineHeight: 12pt`）なら、囲みの高さは行の整数倍のままで、タイトルもグリッドに乗ります。既定の1.2 emでは、囲みごとに1行の端数が加わります。`textTransform: 'uppercase'`は文字数を変えません。`letterSpacing`はタイトルにトラッキングをかけます（canvasの`letterSpacing`、PDFの`Tc`）。`indent`はタイトルを囲みの内側の縁から右へ押し出します。タイトル側（左の角）に掛かる角のバッジは、先に自分の場所（バッジの内側の半分＋`gap`）を確保するので、どのページに来てもタイトルはバッジにかかりません。`indent`はそれに上乗せされるだけです。 |
| `body` | `{ fontFamily, fontSize, lineHeight, color, boldColor, italicColor, fontWeight, boldFontWeight, italic, smallCaps, textAlign, hyphenation, paragraphSpacing, firstLineIndent, tabStops, tabInterval }` | `bodyText`を継承。`italic`/`smallCaps`は`false` | 囲みの中の段落とリスト項目の文字組みです。未設定のフィールドはすべて本文テキストを継承します。`italicColor`はイタリックの部分の色を設定します（囲みの色でイタリックにした引用文など）。`fontWeight`/`boldFontWeight`は通常と太字の部分のウェイトを設定します。`italic`は囲み全体をイタリックにし、`*…*`の部分は立体に戻ります。`smallCaps`は囲み全体をスモールキャピタルにします。`tabStops`と`tabInterval`は囲みの中で本文のものを置き換えます（[タブ位置](https://postext.dev/ja/docs/configuration-text.md#タブ位置)を参照）。囲みのテキストがほかに何を引き継ぐかは[囲みの中の文字組み](https://postext.dev/ja/docs/configuration-callouts.md#囲みの中の文字組み)を参照してください。 |
| `lists` | `{ bulletChar, color, indent, gap, itemSpacing, bulletFontSize, bulletFontWeight }` | `unorderedLists`を継承 | 囲みの中のリストの文字組みです（`color`、`indent`、`gap`、`itemSpacing`は番号付きリストにも適用されます）。`bulletFontSize`/`bulletFontWeight`は、行頭記号のグリフを囲みの本文の書体でそのサイズとウェイトにします（太い色付きの行頭記号など）。 |
| `label` | `{ fontFamily, fontSize, fontWeight, color, background, position, height, paddingX, offset, inset, icon, rule }` | 未設定（タブなし） | 囲みの上辺に付け、フェンスの`label`属性を印字するタブです。番号付きの囲みの番号（「BOX 1-1」）に使います。`position`の角（`'top-right'`/`'top-left'`）に寄せて`inset`だけ内側に置き、囲みの上端から`offset`だけ突き出します（この分はブロックの一部として`marginTop`に上乗せされるので、段の先頭でもタブの場所が確保されます）。高さは`height`で、テキストの左右に`paddingX`を取ります。横に`icon`リソース（`{ resourceId, width, gap }`、角と反対側）を付けることも、上辺に沿って反対側の角からタブまで`rule`（`{ enabled, color, width }`）を引くこともできます。既定値は見出しのフォント、本文のサイズ、`700`、メインカラーの地に白、高さ`1.4em`、内側余白`0.6em`です。タブは枠の上に立つ独立した形なので、囲みの`borderRadius`にかかわらず角は四角いままです。 |
| `columnGap` | `Dimension` | `1.5em` | 囲みの中の`:::columns`グループの段間です（後述のコンテナーの節を参照）。 |
| `marginTop` / `marginBottom` | `Dimension` | `0.75em` / `0.75em` | 囲みの上のアキ（前のブロックのマージンと相殺されます）と、下の最小のアキ（`snapToGrid: false`のときは正確なアキ）です。フロートとして配置した囲み（`placement: 'top'`、`'bottom'`、`'auto'`）は、帯とテキストの間にフロートのアキ（本文1行分）を保ちます。それより広い`marginBottom`は上の帯にある囲みの下のアキを、それより広い`marginTop`は下の帯にある囲みの上のアキを決め、帯とともにグリッドに切り上げられます。postext 1.4までは、フロートとして配置した囲みはマージンを無視していました。 |
| `snapToGrid` | `boolean` | `true` | `true`のとき、囲みの後の流れはベースライングリッドに戻るので、下のアキは`marginBottom`をグリッドの行単位に切り上げた値になります。`false`のとき、囲みは正確な`marginBottom`を保ち、それが次のブロックの上マージンと相殺されます。このスタイルの囲みが2つ続けば、間隔はちょうど`max(marginBottom, marginTop)`です。囲みの後のテキストは、次にグリッドに戻る位置（見出し、リストの終わり）までグリッドから外れることがあり、`headings.snapToGrid: false`の見出しの後と同じ動作になります。囲みを積み重ねて作る文書（ワークシート、書式）向けです。これが効くのは流れの中の囲みです。段組みのレイアウトのページ全幅の囲み、フロートとして配置した囲み、固定の囲み、サイドの囲みはグリッドを保ちます。段の帯とフロートの領域はグリッドに沿って組まれるためです。段末そろえの手段は変わりません。段を締めくくる囲みは、引き続き段の最後のグリッド位置まで押し下げられます。 |
| `keepTogether` | `boolean` | `true` | `true`のとき、囲みは分割しません。残りの場所に収まらない囲みは、まるごと次の段かページに送ります。分割せずに保てないのは、何も入っていない1段分（`span: 'page'`の囲みでは1ページ分）より高い囲みだけです。そうした囲みは、はみ出す代わりに後述の`false`の規則で分割し、現れた位置から始めます。1段に収まる続きは、そこからまるごと送ります。それほど高いフロートの囲み（`placement: 'top' \| 'bottom' \| 'auto'`）はフロートにならず、現れた位置で流れの中にとどまります。`false`のとき、どの囲みも子ブロックの間、または段落やリスト項目の行の間で分割できます。収まる最も深い切れ目で現在の段（`span: 'page'`の囲みではページ。段の下端にそろえます）を閉じ、残りは次の段の先頭で独立した囲みとして続きます。枠と帯は同じで、アイコンはなく、`repeatTitle`で繰り返さない限りタイトルもありません。それでも高すぎれば、さらに分割します。インラインのアイコンが先頭の部分で占める列は、どの断片でも空けたまま残すので、囲みはどのページでも同じ行長になります。リスト項目の中で切るときは、行頭記号を先頭の部分に残します。どの断片の枠もフェンスの`contentIndex`/`containerId`を共有し、`callout.part`/`callout.continued`を記録します。章を締めくくる長い「要点」の囲みには`headings.balancing.beforeSpan`と組み合わせて、また囲みが図をページから押し出してはならない注記のスタイルに使います。入れ子の囲み（別の囲みの中の`:::callout`）は親の子要素の1つとして扱います。切れ目はその前後に入り、入れ子の囲みの中で切るのは、そのスタイルが分割を許すとき（`keepTogether: false`、または1段より高いとき）だけで、そのスタイル自身の`splitMinLines`に従います。 |
| `splitMinLines` | `number` | `2` | 分割された囲み（`keepTogether: false`、または1段より高い分割しない囲み）の断片が、切れ目の前後それぞれに残すテキストの最小行数です。対象はテキストだけです。図、表、別行立ての数式、入れ子の囲みを1つ以上含む側は、行数にかかわらず認められるので、図版の囲みは1点だけをページに残すことがあります。段落やリスト項目の中で切るときも、前後それぞれのすべての行を数えます（そこにある図や数式は1行と数えます）。加えて、その段落や項目の行を前後それぞれに少なくとも`layout.boxChildSplitMinLines`行残します（既定は2行。この最小値のほうが小さければその値なので、1にすれば1行を許します）。既定値では、2行や3行の項目は分割されず、4行の項目は2行ずつにだけ分割されます。既定値では、段の下端や次の段の先頭にテキストが1行だけ残るような分割はしません。最小値を満たす切れ目がないときは、囲みをまるごと送ります。（postext 1.5より前は、段落の中で切るときに側全体の行数しか確かめなかったため、囲みのほかの行で最小値に達すれば、2行の項目が1行ずつに分割されることがありました。） |
| `repeatTitle` | `boolean` | `false` | 分割された囲みの続きの先頭ごとに、タイトルの後に`continuedSuffix`を付けて繰り返します（「Key points (cont.)」）。繰り返したタイトルにはタイトルのスタイルが適用されます。タイトルのない囲みは何も繰り返しません。[分割された囲みの目印](https://postext.dev/ja/docs/configuration-callouts.md#分割された囲みの目印)を参照してください。 |
| `continuedSuffix` | `string` | `'(cont.)'` | 繰り返したタイトルの後に付ける文字列です。分割された表と同じく文書の言語（`locale`、なければハイフネーションのロケール）に従い、表と同じ方法でタイトルにつなげます。 |
| `continuesMarkerEnabled` | `boolean` | `false` | 分割された囲みのうち、続きのある各部分の最終行の下、囲みの中に`continuesMarker`を置きます。 |
| `continuesMarker` | `string` | `'Continued'` / `'Continúa'` | そのマーカーの文字列です（脚本の「(MORE)」など）。囲みの本文の書体とサイズで組み、文書の言語ごとに既定値があります。 |
| `continuesMarkerAlign` | `'left' \| 'center' \| 'right'` | `'right'` | 囲みの内側の幅の中でマーカーを置く位置です。 |
| `continuesMarkerItalic` | `boolean` | `true` | マーカーをイタリックで組みます。 |
| `numbering` | `{ label, counter, numberingTemplate, resetOn, counterFormat, placement, bold, italic, suffix }` | 未設定 | このスタイルの囲みを、定理、補題、定義のような番号付きの命題として数えます。[番号付きの定理と証明](https://postext.dev/ja/docs/configuration-callouts.md#番号付きの定理と証明)を参照してください。 |
| `endMark` | `string` | `''` | 囲みの最終行の末尾に右端そろえで置く記号です。証明を`'∎'`や`'□'`で終えるときに使います。スペースを空けて収まれば最終行に、収まらなければ独立した行に置きます。番号のない別行立て数式で終わる囲みでは、その数式のタグとして置きます。数式が有効なときは、四角（∎ □ ■ ▪ ◻ ▫）をTeXのグリフで描くため、書体にその字形がなくても（Fontsourceのlatinファイルなど）印字されます。数式が無効なときは囲みの本文の書体で組まれます。 |

### `:::callout`コンテナー

`:::callout{type="<id>"}`の行で囲みを開き、`:::`だけの行で閉じます。フェンスは5つの属性を受け付けます。`type`（スタイルのid）、`title`（スタイルのタイトルを上書き）、`span`、`placement`、`columns`（スタイルの値を上書き）です。間の内容は囲みの中に組まれます。省略できるタイトルの後に段落、リスト、引用、数式、リソースの埋め込みが続き、それぞれスタイルの`body`/`lists`の文字組みで組まれます（見出しは通常のスタイルのままです）。子要素の間のマージンは本文と同じく相殺されます。囲みの内部はベースライングリッドから外れ、囲みの後で流れはグリッドに戻り、下に少なくとも`marginBottom`のアキを取ります（グリッドが優先され、マージンは最小値です。リソースと同じ約束です）。`snapToGrid: false`のスタイルでは代わりに正確な`marginBottom`を保ち、囲みの後のテキストは次の見出しかリストの終わりまでグリッドから外れます。囲みの直前の見出しは囲みと一緒に送られます。

このバージョンでの制約は次のとおりです。

- 囲みは、スタイルで`keepTogether: false`を設定しない限り分割しません。段の残りの場所に収まらないときは、まるごと次の段かページに送ります。フロートの帯や帯の上限で短くなった空の段からも、1段分あれば収まる限り送ります。1段より高い囲みは、分割できる囲みと同じように分割します。どの切れ目でも分割できない囲み（段より高い図や表を含むもの、またはどの切れ目でも`splitMinLines`を満たせないもの）だけは、そのまま配置してはみ出させます。このときレイアウトは`calloutOverflow`警告（`VDTDocument.warnings`）を記録し、Sandboxはそれを一覧に表示します。`:::columns`グループは、それを囲む囲みと同じように、グループの段と段の間で切られます（postext 1.25から）。グループがまるごと保たれ、同じようにはみ出すことがあるのは、`layout.flowColumns: false`のときと、入れ子の囲みの中にあるときだけです。分割できる囲みは、収まる部分（子要素まるごと、または前後それぞれに`splitMinLines`行まで残した段落の行。図、表、別行立ての数式は1つで1つの側として足ります）を残し、次の段かページでアイコンのない囲みとして続きます。スタイルで繰り返さない限りタイトルはなく、残した部分の下にマーカーを付けることもできます（[分割された囲みの目印](https://postext.dev/ja/docs/configuration-callouts.md#分割された囲みの目印)を参照）。
- フロートは分割できない囲みに譲ります。図の参照の直後のブロックが`keepTogether`の囲みのとき、その囲みが現在の帯の中で入る段（フロートの前に囲みを収めていた参照元の段、またはその後の空の段）をなくしてしまう位置は使いません。図は次の候補の位置（たいていは次のページ）に移り、囲みは流れの中にとどまります。囲みをページから押し出して段に図だけを残すのではなく、組版者が組むとおりに組みます。
- 段組みのレイアウトで`span: 'page'`を指定すると、囲みは**ページ幅のブロック**になります。版面の全幅で組まれ、ページを段の帯に分けます。囲みの上の段は切れ目の線で閉じ、囲みは全幅の独自の段に入り、その下で新しい段の帯が始まるので、流れはすべての段で囲みの下に続きます。段の高さが*そろっている*位置（ページの先頭、`span: 'page'`の章扉の見出しの直下、別のページ幅のブロックの直下、上のフロートの帯の直下）では、囲みはそこでそのまま切ります。段の高さがそろわないページの途中に来たときは、組版者が組むとおりに組みます。囲みの上のテキストをすべての段で同じ高さに切り（エンジンは帯の段を同じグリッド行数に縮めて配置をやり直すので、テキストは段から段へ自然にあふれ、オーファン、ウィドウ、次と分離しない規則もすべて適用されます）、囲みはページ全幅に広がり、その下で段が再開します。切るには配置を何回か余分にやり直します。切れ目の線で、囲みと、その下にウィドウの最小行数分の本文行を入れる余地がなくなるとき、または数回試しても収まる配置がないときは、囲みを次のページの先頭へ送ります。囲みの上のテキストは切れ目に従います。図の下で段が上に残す数行に入りきらない段落は次の段に送り（その図は段の中で単独になります）、それでもあるブロックが切れ目を越えるときは、そのブロックの終わる位置ではなく、切れ目を1行下げます。帯を開く分割された囲みもそこで切るので、残りが切れ目を越えることはありません。`headings.balancing.beforeSpan`（既定）のときは、囲みが抜けた帯は章の最後の帯と同じように後ろで高さをそろえて切ります。スタイルが分割を許す（`keepTogether: false`）ときは、高さをそろえた段の下に収まる囲みの部分がページを締めくくり、残りが次のページの先頭に来ます。`beforeSpan: false`のときは、抜けたページは通常どおり段末をそろえるだけで、改ページは強制しません。ページ幅のブロックの直前の見出しは、囲みと一緒には送られません。1段のレイアウトでは、`span: 'page'`はただのインラインです。
- `placement: 'fixed'`は囲みを流れから外します。囲みは組まれた後（`width: 'auto'`はタイトルに合わせて縮み、`'fill'`はアンカーの点の下にあるテキストの段の幅を取ります）、流れの中で現れたページの、`fixed.anchor`/`fixed.offset`が示す位置に固定されます。既定は版面の左下の角です。囲みが覆うテキストの段は、フロートの帯とまったく同じようにその領域を明け渡します（下から削り、段がまだ空なら上から削ります）。その領域にすでにテキスト、フロート、ページ幅のブロックがあるときは、囲みを次のページへ送ります。章を締めくくる固定の囲み（次のブロックが章扉、`:::part`、フロートの区切りの囲み、または文書の末尾のもの）は、まず上の段の高さをそろえる（`headings.balancing.trailing`）ので、短い最終ページは下のバッジとそろって終わります。枠と子要素は`page.floats`に入り、どのバックエンドでも段のクリップの外に描画されます。
- `placement: 'top' | 'bottom'`は囲みをリソースと同じように**フロート**として配置します。囲みは現れた位置で流れから外れ、その位置以降で最初に空いている帯（現在のページの下（`'bottom'`）、または流れが次に開くページの上か下）に、段の幅（`span: 'column'`）または版面の全幅（`span: 'page'`）で入ります。後に続くテキストが、囲みの抜けたページを埋めます。枠と子要素は、固定の囲みと同じく`page.floats`に入ります。新しいページの先頭に来るフロートの囲みは、そのページを待っている図より先に組まれます。前のページで引用され、その下に収まる図は、テキストが3行未満しか残らないときでも、そのページの残りを使います（図版のページ：囲みと図だけで、間にテキストはありません）。`span: 'side'`の囲みはフロートになりません。placementにかかわらず、テキストの横に積まれます。`columns`が1より大きいとき（スタイルでもフェンスの属性でも指定でき、postext 1.18以降）、`span: 'column'`の囲みはその数の隣り合う段を使います。上端のそろった空の段の並びの頭か、現在の段とその後の空の段の足です。例：`:::callout{placement="top" columns="2"}`。
- `width: 'auto'`はタイトルにだけ合わせて縮み、子要素は無視します。
- ほかの囲みの中に入れ子にした`:::callout`は、独立した囲みです。自分のスタイル（背景、枠線、角の半径、内側余白、帯、タイトル、アイコン、マーカー、ラベル、文字組み）で、親の内側の全幅に組まれ、親の子要素の1つとして積まれます。`marginTop`/`marginBottom`は隣の要素と相殺されます。`span`と`placement`（フェンスまたはスタイル）は無視され、入れ子の囲みは常に親の中を流れます。`floatBarrier`と`snapToGrid`も無視されます。囲みは何重にでも入れ子にでき、`:::columns`グループの中にも置けます（それぞれ1つの段にまるごと入ります）。親が分割されるとき、切れ目は入れ子の囲みの前後に入り、入れ子のスタイルが分割を許すときはその中にも入ります。どの断片も、切れ目が通る枠を描き直します。前の断片から続く入れ子の囲みは、トップレベルの続きと同じく、タイトルとアイコンを省きます。
- 子要素の中の`:::columns{count=N}`…`:::`グループは、囲みの中で、その子要素を等幅の`N`段に`columnGap`の間隔で組みます。段の高さが最もそろうブロックや行の境界で切り（途中で切れた段落やリスト項目は、次の段の先頭で行頭記号なしに続きます）、どの段もグループの上端から始まり、グループの高さは最も高い段に合わせます。グループの後の子要素は全幅に戻ります。分割される囲み（`keepTogether: false`、または段より高い囲み）は、グループの中でも段と段の間で切ります。snake のグループは段を順に埋めて次の断片に続き、parallel のグループ（`breaks`）は流れごとに続きます（postext 1.25から。[ドキュメント形式 › `:::columns`](https://postext.dev/ja/docs/document-format-directives.md#columns)を参照）。フェンスの`gap`はそのグループについて`columnGap`の代わりになり、`rule`は各段間に罫線を引きます。要点を2段にまとめたり、幅の広い囲みで表を横に並べたりするのに使います。
- フェンスの6つ目の属性`label`は、スタイルのラベルタブに印字されます（前述の`label`を参照）。例：`:::callout{type="box" label="BOX 1-1" title="The octet rule"}`。`label`スタイルがなければこの属性は無視されます。

VDTでは、囲みは`type: 'callout'`の枠ブロックになり、その装飾（背景、帯、アイコン、タイトル）は`designOverlay`に入ります。その後に、同じ段の中で子ブロックが続きます。枠とすべての子要素はフェンスの`containerId`を持ちます。入れ子の囲みは、子要素の中の独立した`type: 'callout'`の枠で、その後に自分のブロックが続きます。それらはトップレベルのフェンスの`containerId`を保ち（配置と段末そろえからは1つの単位に見えます）、`calloutPath`を加えます。これは周りの入れ子のフェンスのコンテナーidを外側から順に並べたものです（入れ子の枠自身のidが最後の要素です）。タグ付きPDFは、入れ子の囲みごとに、親の囲みの中に`Div`を作ります。アイコンの画像はリソースの画像と同じ方法で解決されます。canvasの画像レジストリー、HTMLの`resourceImageUrl`オプション、PDFの`resourceBytes`プロバイダーです。

```ts
const resolved = resolveCalloutStylesConfig(config.calloutStyles, resolvedBodyText, resolvedHeadings, resolvedUnorderedLists, config.locale);
// => every inherited field filled from the resolved sections; the optional
//    locale picks the language of the continuation strings

const minimal  = stripCalloutStylesDefaults(config.calloutStyles);
// => undefined for the built-in `note` default; static defaults dropped
```

### 番号付きの定理と証明

`numbering`を持つスタイルは、LaTeXの`amsthm`が定理環境を数えるように、その囲みを数えます（postext 1.19以降）。各囲みはラベルと番号を印字し（最初の段落の先頭に「**定理2.**」）、フェンスの`title`は番号の後に括弧に入れて続きます。`:::callout{type="theorem" title="Bradley–Terry"}`は「**定理2**（Bradley–Terry）**.**」で始まります。識別子を付けて開いた囲み（`{#thm:main}`）は相互参照の対象になり、参照は「定理2」と印字し（`:ref{id="thm:main"}`）、`\ref{thm:main}`や`style=number`は2を印字します。

| プロパティ | 型 | 既定値 | 説明 |
| --- | --- | --- | --- |
| `label` | `string` | — | 番号の前に置く語です。`'定理'`、`'Lemma'`、`'Definición'`など。 |
| `counter` | `string \| false` | スタイルの`id` | 囲みが進めるカウンターです。同じカウンターを指定したスタイルは、`\newtheorem{lemma}[theorem]`と同じようにそれを共有します（定理1、補題2、定理3）。`'equation'`は、ラベルを付けた数式と一緒に数えます。`false`は番号なしでラベルを印字します（証明の「*証明.*」）。 |
| `numberingTemplate` / `resetOn` / `counterFormat` | `string` / `ResourceCounterReset` / `ResourceCounterFormat` | `'{n}'` / `'never'` / `'decimal'` | リソースの種類のものと同じです。`'{h1}.{n}'`と`resetOn: 'h1'`で章ごとに定理2.1、2.2…と、`'{h1}.{h2}.{n}'`と`'h2'`で節ごとに番号を付けます。複数のスタイルが共有するカウンターは、それぞれのテンプレートが何を印字するかにかかわらず数え続けます。トークンは、リソースタイプのテンプレートと同じく、コロンの後に書式を取れます。`'{h1:A}.{n}'`は、アルファベットを振った付録で*定理 A.1*になります。 |
| `placement` | `'runIn' \| 'title'` | `'runIn'` | `'runIn'`は囲みの最初の段落をラベルで始めます（リスト、数式、別の囲みで始まる囲みには、そのための段落を加えます）。`'title'`はラベルを囲みのタイトルにして、その`titleStyle`で組みます。「定理2（Bradley–Terry）」のようになります。 |
| `bold` / `italic` | `boolean` | `true` / `false` | 段落頭のラベルとその後に付く文字の書体で、囲みの本文にかかわりません。本文がイタリック（`body.italic`）でも、立体のラベルは立体のままです。括弧内のタイトルは、通常のウェイトの立体で組みます。 |
| `suffix` | `string` | `'.'` | 段落頭のラベルとそのタイトルの後に置く文字です。 |

証明は、番号のないラベルと終わりの記号を持つスタイルです。

```ts
calloutStyles: [
  { id: 'theorem', numbering: { label: '定理' }, body: { italic: true } },
  { id: 'lemma', numbering: { label: '補題', counter: 'theorem' }, body: { italic: true } },
  { id: 'definition', numbering: { label: '定義' } },
  { id: 'proof', backgroundEnabled: false, endMark: '□',
    numbering: { label: '証明', counter: false, bold: false, italic: true } },
]
```

章ごとに組む本では、カウンターは前の章から続きます（`LayoutContinuation.statementCounters`。`continuationAfter`が埋めます）。本のアウトラインは番号付きの囲みのアンカーごとにそのラベルを与える（`OutlineEntry.numberLabel`）ので、別の章からの参照もそれを印字します。

### 囲みの中の文字組み

囲みは内容を自分の`body`と`lists`の文字組みで組みます。それ以外はすべて文書のスタイルのままです。

- **段落**は囲みの`body`に従います。書体、サイズ、行送り、色、強調の色、ウェイト、`italic`、`smallCaps`、行そろえ、ハイフネーション、字下げ、段落間隔です。未設定のフィールドは`bodyText`を継承します。継承した強調の色はパレットとのリンクを保つので、囲みの中の太字、イタリック、`:ref`のラベルは、囲みの外と同じく`colorPalette`に合わせて変わります。（postext 1.4までは、囲みの中の太字はメインカラーにかかわらず`#295AA3`のままでした。）
- **箇条書きリスト**は`unorderedLists`より囲みの`lists`（行頭記号の文字、色、グリフのサイズとウェイト、字下げ、アキ、項目の間隔）を優先し、テキストは囲みの本文テキストになります。`lists.bulletChar`や`lists.color`が文書の値（`unorderedLists`）と異なるときは、すべてのレベルの行頭記号や色を置き換えます。同じ値を繰り返すとき、または未設定のときは、各レベルの値（`unorderedLists.levels`）をそのまま残すので、入れ子のダッシュも囲みの中で保たれます。
- **番号付きリスト**は`lists.indent`、`gap`、`itemSpacing`に従い、スタイルが`lists.color`を設定していれば、文書の行頭記号の色と同じ値でもそれに従います。設定していないスタイルでは、番号は`orderedLists.color`のままです。（postext 1.4までは、色が`unorderedLists.color`と異なるときにしか番号に反映されなかったため、まさにその色に設定しても何も変わりませんでした。）番号そのもの（書体、サイズ、区切り）は全体の`orderedLists`から取ります。`lists`には行頭記号のフィールドしかないので、囲みの番号はそちらで設定してください。
- **囲みの中の`:::paragraphs`コンテナー**は、入れ子の囲みの中でも、その段落スタイルに従います。スタイルが設定しないフィールドは、囲みの`body`ではなく文書の`bodyText`を継承します（囲みのイタリックやスモールキャピタルも継承しません）。
- **`:::columns`グループ**には独自のスタイルはありません。どの段も囲みの本文とリストの文字組みを共有し、`columnGap`が段間を決めます。
- **引用**は、囲みの本文の書体、サイズ、ウェイト（本文と同じくイタリックでグレー）と、スモールキャピタルに従います。**見出し**は見出しのスタイルのまま、**別行立ての数式**は数式の設定のままです。
- **図と表**は文書のキャプションと表のスタイルのまま、囲みの内側の幅で組まれます。通常と太字のウェイトは囲みの`body`のウェイトに従います。
- **チップ**はチップのスタイルのままです。`em`のサイズは囲みの本文のサイズを基準に読みます。
- **`:::space`の空き**は囲みの本文の行で測ります（どこで省かれるかは[`:::space`](https://postext.dev/ja/docs/document-format-directives.md#space)を参照）。
- **入れ子の囲み**は自分のスタイルにすべて従います。`span`、`placement`、`floatBarrier`、`snapToGrid`は無視されます。

### 分割された囲みの目印

囲みが段やページをまたいで分割されるとき（`keepTogether: false`、または段より高い囲み）、最初の部分の後の各部分はタイトルとアイコンなしで始まり、既定では囲みが続いていることを読者に示すものは何もありません。2つのオプションで、本や脚本で使う目印を加えられます。

- **`repeatTitle: true`にすると**、続きの先頭ごとにタイトルを繰り返し、その後に`continuedSuffix`を付けます。既定は「Key points (cont.)」の形です。繰り返したタイトルにはタイトルのスタイルが適用されるので、`textTransform: 'uppercase'`と組み合わせれば脚本の「HAMLET (CONT'D)」になります。アイコンとラベルタブは最初の部分にだけ付きます。
- **`continuesMarkerEnabled: true`にすると**、続きのある各部分の最終行の下、囲みの中に`continuesMarker`（「Continued」、スペイン語の文書では「Continúa」）を、囲みの本文の書体とサイズで置きます。`continuesMarkerItalic`が`false`でない限りイタリックで、`continuesMarkerAlign`が`'left'`か`'center'`でない限り右そろえです。マーカーは自分が締めくくる部分の中に場所を取り、切れ目はマーカーが収まるように選ばれます。

```ts
calloutStyles: [{
  id: 'speech',
  keepTogether: false,
  titleStyle: { textTransform: 'uppercase' },
  repeatTitle: true,
  continuedSuffix: "(CONT'D)",
  continuesMarkerEnabled: true,
  continuesMarker: '(MORE)',
  continuesMarkerAlign: 'center',
  continuesMarkerItalic: false,
}],
```

```md
:::callout{type="speech" title="Hamlet"}
A speech long enough to run over the foot of the page…
:::
```

ページを締めくくる部分は「(MORE)」で終わり、次のページは「HAMLET (CONT'D)」で始まります。どちらもページ割りのための補助的な表示です。アクセシブルなPDFではアーティファクトになり、HTMLでは支援技術から隠されるので、タイトルは1度だけ読み上げられます。VDTでは、`artifact: true`の付いた`designOverlay`のテキストブロックです。