13. ページ媒体

13.1 ページ媒体概論（Introduction to paged media）

ページ媒体（紙面、スライドの透明版、コンピュータ画面上のページなど）は、文書の内容が複数のページに分割されるという点において、連続媒体とは異なっている。 改頁を扱うために、CSS2では視覚整形モデルを次の様に拡張する:

1. ボックスモデルを拡張して、ページの大きさや余白を扱うためのページボックスを導入する。
2. 視覚整形モデルを拡張して、改頁を扱えるページモデル（page model）とする。

CSS2のページモデルでは、有限な幅と高さを持つページボックスという矩形領域内に文書をどのように整形するかを指定する。 ページボックスは、文書が最終的に描画される紙面、透明版、画面など実際のシート（sheet）に、必ずしも1対1対応しているとは限らない。 CSSのページモデルでは、ページボックスの内部での整形方法を定めるが、各ページボックスを実際のシートへ移す作業はUAの責任で行うこと。 その方法には以下のようなものがある:

• 1つのページボックスを、1枚のシートに移す。（片面印刷など）
• 2つのページボックスを、同じシートの表裏両面に移す。（両面印刷など）
• N個の（小さな）ページボックスを、1枚のシートに移す。（n-upなどと呼ぶ）
• 1つの（大きな）ページボックスを、N×M枚のシートに移す。（tilingなどと呼ぶ）
• 折り丁を生成する。 折り丁とは、1枚のシートに複数のページを集めて背丁を付けたものだが、本の形に綴じた時に各ページが適切に出現するような順序で印刷する。
• 1つの文書を複数の出力トレイへ移す。
• ファイルに出力する。

UAがページボックスをシートに移す方法はCSS2を通して指定できないが、UAに対象シートの大きさと向きを伝えることは可能である。

13.2 ページボックス（Page boxes: the @page rule）

ページボックス（page box）とは矩形の領域であり、その内部には更に2種類の領域がある:

• ページ領域（page area）。 ページ領域にはそのページにレイアウトされるボックスが含まれている。 ページ領域の四辺は、改頁と改頁の間に出現するボックスをレイアウトするための初期包含ブロックとして機能する。
• 余白領域。 これがページ領域を取り囲んでいる。

@page規則の内部では、ページボックスの寸法、向き、余白などを指定する。 @page規則は、キーワード「@page」、ページセレクタ、そして宣言ブロックから成り、ページセレクタの直後には、空白を挟まずにページの疑似クラスを取り付けることもできる。 また、この宣言ブロックはページコンテキスト（page context）に属していると言う。

ページセレクタ（page selector）は、宣言を適用するページを特定する。 CSS2のページセレクタは、左側のページ、右側のページ、そして特別に名付けられたページを指し示すことができる。

ページボックスの寸法は'size'プロパティで設定する。 ページ領域の寸法は、ページボックスの寸法から余白領域分を差し引いたものである。

@page { size 8.5in 11in; margin: 2cm }

@page規則内で'marks'プロパティを用いると、余白の切り落としや位置調整に役立つトンボを付けることが可能となる。

13.2.1 ページの余白（Page margins）

マージンのプロパティ（'margin-top'、'margin-right'、'margin-bottom'、'margin-left'、'margin'）をページコンテキストで用いると余白を取ることができる。 次の図はシート、ページボックス、余白の関係を表している:

ページ領域の最上段と最下段に位置しているボックスの、マージンの算出値は'0'になる。

ページコンテキストではフォントの概念を扱わないので、'em'や'ex'といった単位は使えない。 また、ページ余白のプロパティにパーセント値を指定すると、ページボックスの寸法を参照値とする。 すなわち左右の余白だとページボックスの幅、上下の余白だとページボックスの高さを参照することになる。 これ以外のCSS2の単位はすべて普通に利用可能である。

ページの余白や、ページ内にある要素のマージンが負の値を取ったり、絶対配置が絡んできたりすると、内容がページボックスの外へはみ出してしまう。 これらはみ出した内容は、UAやプリンタ、あるいは最終的に紙の裁断などによって切り落とされてしまう可能性がある。

13.2.2 ページの大きさ（Page size: the 'size' property）

このプロパティは、ページボックスの大きさと向きを指定する。

ページボックスの大きさは、絶対値（固定）か相対値（シートの大きさに合わせる）のいずれかになる。 値が相対値の場合、UAは文書を拡大・縮小して対象シートに最適化することが可能となる。

'size'の値のうち3つは、相対ページボックスを生成させる:

auto

対象のシートに合わせて、ページボックスの大きさと向きを設定する。

landscape

対象シートの向きに関わらずページボックスを横長にし、その大きさは対象シートに合わせる。

portrait

対象シートの向きに関わらずページボックスを縦長にし、その大きさは対象シートに合わせる。

@page {
  size: auto;   /* auto is the initial value */
  margin: 10%;
}

'size'に長さの値を指定すると、絶対ページボックスが生成される。 長さの値を1つだけ指定すると、ページボックスの幅と高さは同じになる（ボックスは正方形）。 ページボックスは初期包含ブロックになるので、'size'にパーセント値は指定できない。

@page {
  size: 8.5in 11in;  /* width height */
}

UAは、ページボックスをシートに移す工程をユーザに制御させてもよい。 （たとえば、印刷する絶対ページボックスを回転できるような機能を提供するなど）

対象シートに収まらないページボックスの描画（Rendering page boxes that do not fit a target sheet）

ページボックスが対象シートの寸法に収まらない場合、UAは以下の処理を行ってもよい:

• ページボックスを90度回転して収まるならそうする。
• 対象シートに収まるようページを縮小する。

UAは、こういった操作を行う前にユーザに確認を取るべきである。

シート上におけるページボックスの位置（Positioning the page box on the sheet）

ページボックスが対象シートより小さい場合、UAはボックスを自由に配置してよい。 しかし、両面印刷のページを揃えたり、シートの隅に印字する情報の欠落を避けるためにも、シートの中央にボックスを配置するのが望ましい。

13.2.3 トンボを付ける（Crop marks: the 'marks' property）

高度な印刷作業を行う際、ページボックスの外側にトンボを付け加えることができる。 このプロパティは、紙の裁断と位置調整に使うトンボを、ページ辺のすぐ外側に表示するかどうかを指定する。

裁断トンボ（crop marks）はページを切り取る位置を指定する。 調整トンボ（cross marks）は、シート同士の位置を揃えるのに用いる。

これらのトンボは、絶対ページボックスに付けた場合にのみ目に見えることになる（'size'を参照）。 相対ページボックスは大きさを対象シートに合わせるので、トンボは印刷領域の外にはみ出してしまうのである。

調整トンボの大きさ、体裁、位置などはUA依存である。

13.2.4 左右のページと最初のページ（Left, right, and first pages）

文書を両面印刷する時、右のページに印刷するのと左のぺージに印刷するのとではページボックスに違いが出てくる。 ページコンテキストでのみ定義されている2つの疑似クラスを用いると、この違いを表現することができる。

すべてのページは、UAによって自動的に':left'か':right'のどちらかへ分類される。

@page :left {
  margin-left: 4cm;
  margin-right: 3cm;
}

@page :right {
  margin-left: 3cm;
  margin-right: 4cm;
}

左右のページに異なる宣言を与えられると、UAはたとえページボックスを左右のシートに移し分けない場合（たとえば片面印刷のみのプリンタを使う場合）でも、宣言の違いを反映しなければならない。

:first疑似クラスを用いて、文書の最初のページに対してスタイルを設定することもできる。

@page { margin: 2cm } /* 四辺の余白を 2cm 取る */

@page :first {
  margin-top: 10cm    /* 1ページ目の上部余白は 10cm */
}

文書の先頭ページが':left'と':right'のどちらに属するかは文書全体の書字方向に依存しており、本仕様の対象外の問題である。 ただ、最初のページを強制的に左右どちらかに固定したければ、最初のボックスの前に改頁を入れることで実現するとよい。 （たとえばHTMLなら、BODY要素に改頁を設定すればよい）

':left'（あるいは':right'）に属する@page規則の指定は、疑似クラスが無い@page規則の指定を上書きする。 また、:firstに属する@page規則の指定は、':left'（あるいは':right'）に属する@page規則の指定を上書きする。

13.2.5 ページボックスからはみ出す内容の扱い（Content outside the page box）

ページモデルで文書の内容を整形すると、内容がページボックスをはみ出してしまうことがある。 たとえば、'white-space'の値が'pre'である要素は、ページボックスより広い幅のボックスを生成することがある。 また、絶対配置のボックスが不都合な位置にきてしまうこともある。 たとえば、画像をページボックスの辺上や、ページボックスの100,000インチ下に配置することも可能なのである。

これらはみ出す要素の正確な整形の規定は、本仕様の対象外である。 ただし、はみ出す内容について、文書作成者とUAは以下の一般原則を守るよう推奨する:

• はみ出す内容の量は、断ち切りが差し支えない程度に少なくすべきである。
• 要素の位置を尊重する余り、大量の白紙ページを出力するのは避けるべきである。 ただし、'page-break-before'や'page-break-after'の値が'left'あるいは'right'なら、その値を尊重するために少々の白紙ページを出力する必要はあるだろう。
• 文書作成者は、ある要素を表示したくないという理由だけで、その要素をはみ出した位置に配置すべきではない。 その代わり次のようにするとよい:
  • その要素がボックスを生成しないように、'display'を'none'に設定する。
  • その要素が生成するボックスを見えなくするために、'visibility'を利用する。
• UAがページからはみ出すボックスを処理するにはいくつか方法がある。 そのボックスを放棄したり、文書の末尾へ新たにページボックスを付け加えて、そこに出力したりしてもよい。

13.3 改頁（Page breaks）

以下の章では、CSS2のページ整形について述べる。 5つのプロパティを用いて、UAが改頁してよい箇所、改頁すべき箇所、そして以降の内容を左右どちらのページから再開すべきか、などを指定する。 各改頁によって現在のページボックスでのレイアウトは終了し、木構造の残りは新たなページボックスにレイアウトする。

13.3.1 要素の直前・直後で改頁する（Break before/after elements: 'page-break-before', 'page-break-after', 'page-break-inside'）

各値は以下の様な意味を持つ:

auto

その要素が生成するボックスの直前・直後・内部での改頁を、強制も禁止もしない。

always

その要素が生成するボックスの直前・直後での改頁を常に強制する。

avoid

その要素が生成するボックスの直前・直後・内部での改頁を抑制する。

left

次のページが左手側のページとして整形できるように、必要に応じて1度だけあるいは2度連続の改頁を強制する。

right

次のページが右手側のページとして整形できるように、必要に応じて1度だけあるいは2度連続の改頁を強制する。

通常の場合、特定の位置で改頁が可能かどうかは、親要素の'page-break-inside'、先行要素の'page-break-after'、そして後行要素の'page-break-before'の値によって決まる。 これらのプロパティが'auto'以外の値を取って互いに競合する時、改頁の強制が抑制よりも優先する。 改頁の強制と抑制の相互関係について、正確な規則は[13.3.4 改頁が許可される場所]を参照のこと。

13.3.2 ページを名前で識別する（Using named pages: 'page'）

'page'プロパティを用いると、要素を表示させたいページの名前を指定できる。

@page rotated {size: landscape}
TABLE {page: rotated; page-break-before: right}

'page'プロパティは次の様に機能する:
内容がインラインであるブロックボックスの'page'プロパティが、先行ブロックボックスと異なる値を取る場合、両者の間に1つか（必要に応じて）2つの改頁を挿入する。 そして、改頁後のボックスを指定された名前のページに表示する。 詳細は[13.3.5 強制改頁]を参照のこと。

@page narrow {size: 9cm 18cm}
@page rotated {size: landscape}
DIV {page: narrow}
TABLE {page: rotated}

<DIV>
<TABLE>...</TABLE>
<TABLE>...</TABLE>
</DIV>

13.3.3 要素の途中での改頁を制御する（Breaks inside elements: 'orphans', 'widows'）

'orphans'プロパティは、ページの最下部の（途中で切れる）段落に最低残さなければならない行数を指定する。 'widows'プロパティは、ページ最上部の（途中から始まる）段落に最低残さなければならない行数を指定する。 これらを使って改頁を制御する例は後に示す。

段落の整形についての詳細は行ボックスを参照のこと。

13.3.4 改頁が許可される場所（Allowed page breaks）

通常フローでは以下の位置で改頁可能である:

1. 縦に積み上がったブロックボックスの間にあるマージン。 ここで改頁する場合、関わりがある'margin-top'と'margin-bottom'の算出値は'0'になる。
2. ブロックボックスの内部にある、行ボックス同士の間。

これらの位置での改頁は以下の規則に従う:

• 規則 A : (1)の位置で改頁を行うには、対象のマージンを共有しているすべての要素について、'page-break-after'及び'page-break-before'が適切な値であればよい。 つまり、関わりあるプロパティのうち、少なくとも1つが'always'、'left'、'right'いずれかの値を取る場合、あるいは関わりあるすべてのプロパティが'auto'という値を取る場合に改頁できる。
• 規則 B : ただし、関わりあるすべてのプロパティが'auto'という値を取る場合でも、対象のマージンを共有する全要素の最も近い共通祖先が、'page-break-inside'に'avoid'という値を取る場合に限っては、改頁できない。
• 規則 C : (2)の位置で改頁を行うには、（改頁位置を含む）ブロックボックスの先頭から改頁位置までの行ボックスの数が、'orphans'の値以上でなければならない。 同様に、改頁位置からブロックボックス末尾までの行ボックスの数が、'widows'の値以上でなければならない。
• 規則 D : 規則Cに加えて、改頁位置を含むブロック要素の'page-break-inside'の値が'auto'なら、(2)の位置で改頁できる。

以上の規則を用いても、内容がページをはみ出さない様な改頁位置が決まらなければ、規則BとDを破棄して改頁位置を決める。

それでも適切な改頁位置が決まらなければ、規則AとCを破棄して改頁位置を決める。

絶対配置のボックス内では改頁できない。

13.3.5 強制改頁（Forced page breaks）

あるマージンでの改頁に関わるすべての'page-break-after'及び'page-break-before'プロパティのうち、少なくとも1つが'always'、'left'、'right'いずれかの値を取る場合、(1)の位置で改頁しなければならない。

あるマージン直前の行ボックスと、直後の行ボックスが'page'に同じ値を取らない場合、(1)の位置で改頁しなければならない。

13.3.6. 最適な改頁位置（"Best" page breaks）

CSS2では、改頁が許可されている位置が複数存在する時に、実際にどこで改頁しなければならないかは定めない。 CSS2は、改頁を特定の位置で行うことや、全く改頁しないことを禁止しない。 ただし、UAは以下の基準に従って最適の改頁位置を見つけるのが望ましい（基準同士が相互に矛盾し得ることを認識しつつ）:

• 改頁回数はできるだけ少なくする。
• 強制改頁で終らないすべてのページは、できるだけ同じ程度の高さを持つようにする。
• ボーダーが存在するブロックの途中で改頁するのは避ける。
• 表の途中で改頁するのは避ける。
• 浮動要素の途中で改頁するのは避ける。

13.4 ページコンテキストにおけるカスケード処理（Cascading in the page context）

ページコンテキストでの宣言は、通常のCSS2宣言と同じカスケード処理に従う。

@page {
  margin-left: 3cm;
}

@page :left {
  margin-left: 4cm;
}