概要
page-break-before CSS プロパティは、現在の要素の前で 改ページが行われるように調整します。
このプロパティは、ボックスを生成するブロックレベル要素に適用されます。ボックスを生成しない空の <div> には適用されません。
補足 : このプロパティは現在、より包括的な break-before に置き換えられつつあります。新しいプロパティによって、カラムや領域の境界も扱えるようになり、page-break-before と構文上の互換性を持っています。
page-break-before を使う前に、break-before で代用できるか確認してください。将来、page-break-before は単なるエイリアスになると思われます。
| 初期値 | auto |
|---|---|
| 適用対象 | block-level elements in the normal flow of the root element. User agents may also apply it to other elements like table-row elements. |
| 継承 | 不可 |
| メディア | visual, paged |
| 計算値 | 指定値 |
| アニメーションの可否 | 不可 |
| 正規順序 | 形式文法で定義される一意のあいまいでない順序 |
構文
/* Keyword values */ page-break-before: auto; page-break-before: always; page-break-before: avoid; page-break-before: left; page-break-before: right; page-break-before: recto; page-break-before: verso; /* Global values */ page-break-before: inherit; page-break-before: initial; page-break-before: unset;
値
auto- 初期値です。 自動的な改ページが行われます（強制や禁止の機能は持ちません）。
always- 要素の前で必ず改ページが行われるように強制します。
avoid- 要素の前で改ページされないようにします。
left- 要素の前における改ページを強制し、次のページが左ページとして整形されるようにします。
right- 要素の前における改ページを強制し、次のページが右ページとして整形されるようにします。
recto- 左から右に読むページにおいて
rightと同じ動作をします。右から左に読むページであればleftと同じ働きをします。 verso- 左から右に読むページにおいて
leftと同じ動作をします。右から左に読むページであればrightと同じ働きをします。
形式構文
auto | always | avoid | left | right
例
/* div の前で改ページされないようにします */
div.note {
page-break-before: avoid;
}
仕様
| 仕様書 | 状況 | 備考 |
|---|---|---|
| CSS Logical Properties Level 1 The definition of 'recto and verso' in that specification. |
勧告改訂案 | recto と verso の追加 |
| CSS Paged Media Module Level 3 The definition of 'page-break-before' in that specification. |
草案 | プロパティが適用される要素を table rows と table row groups に拡張 |
| CSS Level 2 (Revision 1) The definition of 'page-break-before' in that specification. |
勧告 | 最初の定義 |
ブラウザ実装状況
| 機能 | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|
基本サポート (auto, always) |
1.0 | 1.0 (1.7 or earlier) | 4.0 | 7.0 | 1.2 (125) |
avoid, left, right |
1.0 | 未サポート (バグ 132035) | 4.0 | 7.0 | 1.2 (125) |
| 機能 | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| 基本サポート | ? | 1.0 (1.0) | ? | ? | ? |
avoid, left, right |
? | 未サポート (バグ 132035) | ? | ? | ? |