Limited support 注意が必要。一部のブラウザのみ対応。プロダクション利用は慎重に判断すること。

概要

page-break系プロパティは、印刷レイアウトにおけるページ区切りを制御するための旧来の記法です。現在はbreak-before、break-inside、break-afterプロパティの標準的なエイリアスとして機能します。レガシーコードとの互換性を維持する目的で存在しますが、新規開発ではbreak系プロパティの使用が推奨されます。

対応ブラウザ

デスクトップ

Chrome 1+
Edge 12+
Safari 未対応
Firefox 未対応

モバイル

Chrome Android 18+
Safari iOS 未対応
Firefox Android 未対応

基本構文

CSS
/* レガシー記法 */
.no-break {
  page-break-inside: avoid;
}
/* 推奨される記法 */
.no-break {
  break-inside: avoid;
}

実務での使いどころ

  • レガシーコードの印刷スタイル維持

    古いブラウザや既存コードベースとの互換性を保ちつつ、印刷時のページ区切り制御を行います。

注意点

  • 新規開発ではbreak-before、break-inside、break-afterプロパティを使用してください。page-break系は互換性のためのエイリアスです。

アクセシビリティ

  • 印刷スタイルでは、見出しとその直後のコンテンツが同じページに収まるよう設定すると、印刷物の読みやすさが向上します。