Join MDN and developers like you at Mozilla's View Source conference, 12-14 September in Berlin, Germany. Learn more at https://viewsourceconf.org

page-break-before

概要

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.
勧告改訂案 rectoverso の追加
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) ? ? ?

参考情報

ドキュメントのタグと貢献者

 このページの貢献者: hashedhyphen
 最終更新者: hashedhyphen,