このプロパティは
break-before
プロパティによって置き換えられました。page-break-before
CSS プロパティは、現在の要素の前で改ページが行われるように調整します。
このプロパティは、ボックスを生成するブロックレベル要素に適用されます。ボックスを生成しない空の <div>
には適用されません。
/* キーワード値 */ 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; /* グローバル値 */ page-break-before: inherit; page-break-before: initial; page-break-before: unset;
初期値 | 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. |
継承 | なし |
メディア | 一括指定の各プロパティとして |
計算値 | 指定値 |
アニメーションの種類 | 個別 |
正規順序 | 形式文法で定義される一意のあいまいでない順序 |
改ページの別名
page-break-before
プロパティは古いプロパティとなり、 break-before
によって置き換えられました。
互換性のため、 page-break-before
はブラウザーから break-before
の別名として扱われます。これにより、 page-break-before
を使用しているサイトが引き続き設計通りに動作することを保証します。値のサブセットは次のような別名になります。
page-break-before | break-before |
---|---|
auto |
auto |
left |
left |
right |
right |
avoid |
avoid |
always |
page |
構文
値
auto
- 初期値です。自動的な改ページが行われます (強制や禁止の機能は持ちません)。
always
- 要素の前で必ず改ページが行われるように強制します。
avoid
- 要素の前で改ページされないようにします。
left
- 要素の前における改ページを強制し、次のページが左ページとして整形されるようにします。
right
- 要素の前における改ページを強制し、次のページが右ページとして整形されるようにします。
recto
- 左から右に読むページにおいて
right
と同じ動作をします。右から左に読むページであればleft
と同じ働きをします。 verso
- 左から右に読むページにおいて
left
と同じ動作をします。右から左に読むページであればright
と同じ働きをします。
形式文法
auto | always | avoid | left | right | recto | verso
例
/* div の前で改ページされないようにします */ div.note { page-break-before: avoid; }
仕様書
仕様書 | 状態 | 備考 |
---|---|---|
CSS Logical Properties and Values Level 1 recto and verso の定義 |
編集者草案 | recto と verso の追加 |
CSS Paged Media Module Level 3 page-break-before の定義 |
草案 | プロパティが適用される要素を table rows と table row groups に拡張 |
CSS Level 2 (Revision 1) page-break-before の定義 |
勧告 | 初回定義 |
ブラウザーの対応
このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 https://github.com/mdn/browser-compat-data をチェックアウトしてプルリクエストを送信してください。
Update compatibility data on GitHub
デスクトップ | モバイル | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
page-break-before | Chrome 完全対応 1 | Edge 完全対応 12 | Firefox
完全対応
1
| IE 完全対応 4 | Opera 完全対応 7 | Safari 完全対応 1.2 | WebView Android 完全対応 37 | Chrome Android 完全対応 18 | Firefox Android
完全対応
4
| Opera Android ? | Safari iOS 完全対応 1 | Samsung Internet Android ? |
凡例
- 完全対応
- 完全対応
- 実装状況不明
- 実装状況不明
- 実装ノートを参照してください。
- 実装ノートを参照してください。